Introduction
Dans un monde où les applications web évoluent à une vitesse vertigineuse, et où l'innovation est souvent synonyme de complexité accrue, j'ai pris le contre-pied avec mon client Mastodon. Bien que ce projet ne soit pas entièrement terminé, il regorge de détails subtils que je pense précieux et que je souhaite partager avec vous.
Classes CSS Lisibles
L'un des aspects les plus notables de mon client est l'utilisation de classes CSS lisibles. Contrairement à la tendance actuelle des applications monolithiques où les noms de classes sont souvent cryptiques, j'ai choisi d'adopter une convention de nommage plus accessible. J'utilise le système de scoping de CSS de Svelte avec des noms de classes capitalisés, ce qui facilite la lecture du DOM et la maintenance du code.
La suppression des hash a été intentionnelle, bien que cela empêche l'utilisation de plusieurs composants avec le même nom. Cependant, cette limitation ne m'a jamais posé problème. En production, les classes sous-scorées sont automatiquement converties pour un scoping approprié, ce qui améliore la clarté sans compromettre la fonctionnalité.
Optimisation du DOM et Taille du Bundle
En termes d'optimisation, j'ai une approche particulière vis-à-vis de la taille des bundles et de la propreté du DOM. En utilisant des modules CSS pour des "composants" dont l'unique but est d'ajuster le CSS, tels que les panneaux ou les icônes, j'ai pu réduire considérablement la taille de mon bundle. J'ai également développé un générateur de code pour rendre les icônes moins fastidieuses à gérer et facilement "tree-shakable".
Consistance dans le Nommage
Pour garantir la consistance, j'ai dirigé Vite pour qu'il utilise la même fonction de génération de noms de classes que Svelte. Cela a permis d'assurer que les noms de classes soient homogènes dans le build de production, un détail qui peut sembler mineur mais qui fait toute la différence pour quelqu'un avec un penchant pour l'ordre et la structure.
Utilisation au Quotidien
Malgré ses imperfections et son statut non achevé, j'utilise mon client Mastodon quotidiennement. Cette utilisation régulière me permet d'identifier des améliorations et des ajustements en continu, le tout en maintenant un workflow fluide et efficace.
Conclusion
Mon client Mastodon est un projet en constante évolution, façonné par des choix de conception qui privilégient la lisibilité et l'efficacité. Si tu cherches à en savoir plus ou à discuter de ton propre projet, je t'invite à prendre quelques minutes pour en parler.
Discutons de ton projet en 15 minutes.