Is this the end of the Prettier/ESLint era? Prettier/ESLint If you're a developer, you're surely familiar with Prettier and ESLint. With over eight years of existence, they have established themselves as references in the JavaScript ecosystem. Prettier, as a code formatter, has not only made coding easier by enforcing stylistic uniformity but has also put an end to countless debates over coding standards within teams. By automating and standardizing code formatting, Prettier allows one to focus on logic and features rather than the aesthetics of the code. On the other hand, ESLint is a powerful JS linting tool. Designed to identify and report syntax errors, style issues, and bad practices in the code, it thus helps to maintain quality standards and consistency within projects. Prettier bounty 🏆 Recently, Christopher Chedeau (Vjeux), the creator of Prettier and co-creator of React Native, promised a $10,000 bonus for any Rust project that passes more than 95% of the JS Prettier test suite. Why this competition? In practice, Prettier has been the dominant code formatter for JavaScript, and due to a lack of competition, there has been little incentive to push its performance and improve the tool. In reality, for many developers in recent years, Prettier has been the default JS code formatter. This overwhelming market dominance resulted in a lack of competition, leading, in turn, to a loss of interest among maintainers in improving the tool's performance. By funding and then highlighting a competitor written in Rust, capable of passing the majority of its JS test suite, Prettier thus recreated this healthy competition that will potentially allow it to challenge the details of its current implementation. Interested in the initiative as well as the outcome of this bounty hunt, many tech players like Guillermo Rauch, CEO of Vercel, have increased the reward to a total of $22,500. From this competition, one project emerged victorious: Biome.js 🎉 Biome.js, one tool to rule them all Biome is a fork of Rome, which was originally an ambitious tool written in Rust but abandoned in October 2023. It includes both a linter and a formatter, putting an end to the time-consuming difficulties associated with reconciling ESLint and Prettier rules. On paper, Biome.js offers several advantages: Better performance: according to their benchmarks, it boasts a formatting speed that surpasses Prettier by 25 times and dethrones ESLint by 15 times on a MacBook Pro M1.
Simplified installation: only one dependency to install, replacing ESLint, Prettier, and several plugins necessary for their proper functioning.
A single configuration file for both formatting and linting.
Native TypeScript support. Should we migrate now? If this tool is so powerful, why hasn't it been universally adopted yet? After several weeks of use, I've identified some edge cases that might hinder its adoption: Not yet complete support for CSS, Vue, Svelte, or Astro.
Tailwind class sorting is still in beta.
No "group sorting" in import sorting yet.
No plugins (addition planned in the roadmap).
Still some bugs in VSCode. To conclude my opinion, I believe it's preferable to continue using ESLint + Prettier for now because their wider support and massive adoption by the industry give them a lead that's still too significant. However, Biome.js is a very promising project that should be kept an eye on, as its evolution could potentially lead it to replace these two pillars of the JS ecosystem, which are Prettier and ESLint, one day. 🧐 How to use it? For those curious to still try out this tool, simply run this command in your project: npx @biomejs/biome init It will install all the necessary dependencies in your project and create a biome.jsonc file, which, similar to a .prettierrc or .eslintrc, will allow you to configure your project. If you want to fully take advantage of Biome.js in VSCode, you can install the Biome extension. And if you're using a different IDE, take a look at the documentation. Thanks to Alex Mongeot for helping me write this article. ❤️ Is this the end of the Prettier/ESLint era? Prettier/ESLint If you're a developer, you're surely familiar with Prettier and ESLint . With over eight years of existence, they have established themselves as references in the JavaScript ecosystem. Prettier ESLint Prettier, as a code formatter, has not only made coding easier by enforcing stylistic uniformity but has also put an end to countless debates over coding standards within teams. By automating and standardizing code formatting, Prettier allows one to focus on logic and features rather than the aesthetics of the code. On the other hand, ESLint is a powerful JS linting tool. Designed to identify and report syntax errors, style issues, and bad practices in the code, it thus helps to maintain quality standards and consistency within projects. Prettier bounty 🏆 Recently, Christopher Chedeau (Vjeux), the creator of Prettier and co-creator of React Native, promised a $10,000 bonus for any Rust project that passes more than 95% of the JS Prettier test suite. Christopher Chedeau Why this competition? In practice, Prettier has been the dominant code formatter for JavaScript, and due to a lack of competition, there has been little incentive to push its performance and improve the tool. In reality, for many developers in recent years, Prettier has been the default JS code formatter. This overwhelming market dominance resulted in a lack of competition, leading, in turn, to a loss of interest among maintainers in improving the tool's performance. By funding and then highlighting a competitor written in Rust, capable of passing the majority of its JS test suite, Prettier thus recreated this healthy competition that will potentially allow it to challenge the details of its current implementation. Interested in the initiative as well as the outcome of this bounty hunt, many tech players like Guillermo Rauch , CEO of Vercel, have increased the reward to a total of $22,500. Guillermo Rauch From this competition, one project emerged victorious: Biome.js 🎉 Biome.js Biome.js, one tool to rule them all one tool to rule them all Biome is a fork of Rome , which was originally an ambitious tool written in Rust but abandoned in October 2023. It includes both a linter and a formatter, putting an end to the time-consuming difficulties associated with reconciling ESLint and Prettier rules. Rome On paper, Biome.js offers several advantages: Better performance: according to their benchmarks, it boasts a formatting speed that surpasses Prettier by 25 times and dethrones ESLint by 15 times on a MacBook Pro M1. Simplified installation: only one dependency to install, replacing ESLint, Prettier, and several plugins necessary for their proper functioning. A single configuration file for both formatting and linting. Native TypeScript support. Better performance: according to their benchmarks , it boasts a formatting speed that surpasses Prettier by 25 times and dethrones ESLint by 15 times on a MacBook Pro M1. benchmarks Simplified installation: only one dependency to install, replacing ESLint, Prettier, and several plugins necessary for their proper functioning. A single configuration file for both formatting and linting. Native TypeScript support. Should we migrate now? If this tool is so powerful, why hasn't it been universally adopted yet? After several weeks of use, I've identified some edge cases that might hinder its adoption: Not yet complete support for CSS, Vue, Svelte, or Astro. Tailwind class sorting is still in beta. No "group sorting" in import sorting yet. No plugins (addition planned in the roadmap). Still some bugs in VSCode. Not yet complete support for CSS, Vue, Svelte, or Astro. Not yet complete support Tailwind class sorting is still in beta. Tailwind class sorting No "group sorting" in import sorting yet. import sorting No plugins (addition planned in the roadmap ). roadmap Still some bugs in VSCode. To conclude my opinion, I believe it's preferable to continue using ESLint + Prettier for now because their wider support and massive adoption by the industry give them a lead that's still too significant. However, Biome.js is a very promising project that should be kept an eye on, as its evolution could potentially lead it to replace these two pillars of the JS ecosystem, which are Prettier and ESLint, one day. 🧐 How to use it? For those curious to still try out this tool, simply run this command in your project: npx @biomejs/biome init npx @biomejs/biome init It will install all the necessary dependencies in your project and create a biome.jsonc file, which, similar to a .prettierrc or .eslintrc , will allow you to configure your project. biome.jsonc .prettierrc .eslintrc If you want to fully take advantage of Biome.js in VSCode, you can install the Biome extension . And if you're using a different IDE, take a look at the documentation. Biome extension Thanks to Alex Mongeot for helping me write this article. ❤️ Thanks to Alex Mongeot for helping me write this article. ❤️ Alex Mongeot

The is an opinion piece based on the author’s POV and does not necessarily reflect the views of HackerNoon.

Biome.js: The New Challenger to Prettier and ESLint

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Code Smell 236 - What to Do With Excessively Long Code Lines

How Dyslexia Shapes The Way I Code

100 Pieces of Programming Advice from the Book Clean Code by Robert Martin

10 Ways to Prevent and Manage Technical Debt—Tips from Developers

10 Expert Tips for Improving Code Reviews: A Guide for Developers

10 Coding Hacks to Remember in 2023

Code Smell 236 - What to Do With Excessively Long Code Lines

How Dyslexia Shapes The Way I Code

100 Pieces of Programming Advice from the Book Clean Code by Robert Martin

10 Ways to Prevent and Manage Technical Debt—Tips from Developers

10 Expert Tips for Improving Code Reviews: A Guide for Developers

10 Coding Hacks to Remember in 2023

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps