Biome.js : Prettier+ESLint killer ?
Is this the end of the Prettier/ESLint era?
Prettier/ESLint
Si vous êtes un dev, vous connaissez sûrement Prettier et ESLint. Avec plus de 8 ans d’existence, il se sont imposés comme des références dans l'écosystème JavaScript.
Prettier, en tant que code formatter, a non seulement facilité l'écriture de code en imposant une uniformité stylistique, mais a également mis fin à d'innombrables débats sur les normes de codage au sein des équipes.
En automatisant et en uniformisant la mise en forme du code, Prettier permet de se concentrer sur la logique et les fonctionnalités plutôt que sur l'esthétique du code.
ESLint, de son côté, est un outil de linting JS puissant. Conçu pour identifier et signaler les erreurs de syntaxe, les problèmes de style, et les mauvaises pratiques dans le code ; il permet ainsi de maintenir des standards de qualité et de cohérence au sein des projets.
Prettier bounty 🏆
Récemment, Christopher Chedeau (Vjeux), le créateur de Prettier et co-créateur de React Native, a promis une prime de 10 000$ pour tout projet Rust qui réussira plus de 95% de la suite de tests JS Prettier.
Pourquoi cette compétition ? En pratique, Prettier a été le formateur de code dominant pour JavaScript et en raison d'un manque de concurrence, il y a eu peu d'incitation à pousser ses performances et améliorer l’outil.
En pratique, pour beaucoup de développeurs ces dernières années, Prettier a été le formateur de code JS par défaut. De cette domination écrasante du marché a résulté un manque de compétition ; entraînant par la même occasion une perte d’intérêt des maintainers pour l’amélioration des performances de l’outil.
En finançant puis mettant en avant un concurrent écrit en Rust, capable de passer la majorité de sa suite de test JS ; Prettier a donc recréé cette compétition saine qui lui permettra potentiellement de challenger les détails de son implémentation actuelle.
Intéressés par la démarche mais aussi l’issue de cette chasse à la prime, de nombreux acteurs de la tech comme Guillermo Rauch, le CEO de Vercel, ont fait grimper la récompense à un total de 22 500 $.
De cette compétition, un projet est sorti victorieux : Biome.js 🎉
Biome.js, one tool to rule them all
Biome est un fork de Rome, qui était à l'origine un outil ambitieux écrit en Rust mais abandonné en octobre 2023. Il inclut un linter et un formatter, mettant fin aux difficultés chronophages associées à la conciliation des règles ESLint et Prettier.
Sur le papier Biome.js présente plusieurs avantages :
- de meilleures performances : selon leurs benchmarks, on parle d'une vitesse de formatage surpassant Prettier de 25 fois et détrônant ESLint de 15 fois sur un MacBook Pro M1
- une installation simplifiée : une seule dépendance à installer venant remplacer ESLint, Prettier et plusieurs plugins nécessaires à leur bon fonctionnement
- un seul et unique fichier de configuration pour le formatting et le lint
- un support typescript natif
Faut-il l’utiliser dès maintenant ?
Si cet outil est si puissant, pourquoi n’est il pas encore adopté par tous ? Après plusieurs semaines d’utilisation, j’ai malgré tout identifié certains edge-cases qui peuvent freiner son adoption :
- Support par encore complet de CSS, Vue, Svelte ou encore Astro
- Class sorting tailwind encore en beta
- Pas encore de “group sorting” dans l’import sorting
- Absence de plugins (ajout prévu dans la roadmap)
- Encore quelques bugs sur VSCode
Pour conclure sur mon avis, je pense qu’il est préférable de continuer d’utiliser ESLint + Prettier pour le moment car le plus large support et l’adoption massive de ces outils par l’industrie leur confèrent une avance encore trop importante.
Cependant, Biome.js est un projet très prometteur qu’il faudra garder à l’oeil car son évolution pourrait l’amener, un jour, à remplacer ces deux piliers de l’eco-système JS que sont Prettier et ESLint. 🧐
Comment l’utiliser ?
Pour les curieux qui veulent tout de même tester cet outil, lancez simplement cette commande dans votre projet :
npx @biomejs/biome init
Elle installera toutes les dépendances nécessaires dans votre projet et créera un biome.jsonc qui, à la manière d’un .**prettierrc / .eslintrc ,** vous permettra de configurer votre projet.
Si vous voulez profiter pleinement de Biome.js dans VSCode, vous pouvez installer l’extension Biome. Et si vous utilisez un autre IDE, jetez un oeil à la doc.
Merci à Alex Mongeot de m'avoir aidé à rédiger cet article. ❤️