Adiós Rome, hola Biome: una nueva cadena de herramientas frontend todo en uno

3 min

1. La «fatiga de herramientas» en el desarrollo frontend

En el desarrollo frontend moderno, un proyecto suele necesitar una combinación compleja de herramientas para funcionar con fluidez:

  • Linter: ESLint comprueba la calidad del código JavaScript/TypeScript.
  • Formateador: Prettier unifica el estilo del código.
  • Compilador: Babel o TypeScript (tsc) transforman el código.
  • Empaquetador: Webpack, Rollup o Vite empaquetan la aplicación.

Gestionar la configuración, los plugins, las versiones y las interacciones de estas herramientas ya supone por sí solo una cantidad considerable de trabajo. Es lo que se conoce como «fatiga de herramientas». Durante años, la comunidad ha explorado la posibilidad de una cadena de herramientas todo en uno, con la esperanza de resolver todos los problemas con una sola herramienta.

2. La visión de Rome y el nacimiento de Biome

Rome fue un proyecto ambicioso iniciado por Sebastian McKenzie, antiguo empleado de Facebook y autor de Babel, con el objetivo de reescribir en TypeScript toda la cadena de herramientas frontend. Su visión era ofrecer una herramienta unificada, de alto rendimiento y sin configuración. Sin embargo, tras años de desarrollo e intentos de comercialización, Rome Labs anunció en 2023 el cese de sus operaciones.

Por suerte, el código central de Rome era de código abierto. La comunidad actuó con rapidez, creó un fork llamado Biome y confió su mantenimiento a una organización comunitaria dedicada a heredar y materializar la visión original de Rome.

3. ¿Qué es Biome?

Biome es una cadena de herramientas frontend de alto rendimiento reescrita en Rust. Busca ofrecer una experiencia de desarrollo unificada y extremadamente rápida que sustituya a una serie de herramientas independientes como ESLint y Prettier.

A finales de 2023, las funciones principales de Biome se concentraban sobre todo en el Linter y el Formateador, donde ya demostraba una capacidad impresionante.

Principales ventajas:

  • Rendimiento excepcional: Gracias a Rust, Biome funciona mucho más rápido que ESLint y Prettier, escritos en JavaScript. En bases de código grandes, la mejora puede alcanzar un orden de magnitud.
  • Configuración unificada: Un único archivo biome.json permite gestionar el comportamiento de todas las herramientas y sustituir archivos dispersos como .eslintrc, .prettierrc y .editorconfig.
  • Diagnósticos detallados: El Linter de Biome no solo señala los errores, sino que también ofrece abundante contexto y sugerencias de corrección para ayudar a los desarrolladores a entender la raíz del problema.
  • Compatibilidad con Prettier: El formateador de Biome busca ser compatible con más del 95% de las reglas de Prettier, por lo que el coste de migrar desde Prettier es muy bajo.

4. Primeros pasos

Puedes probar rápidamente Biome en tu proyecto mediante npx:

# 检查当前项目中的代码问题
npx @biomejs/biome check ./src

# 自动修复可修复的 lint 问题
npx @biomejs/biome check --apply ./src

# 格式化代码
npx @biomejs/biome format --write ./src

Crea un archivo biome.json para personalizar las reglas y la configuración:

{
  "$schema": "https://biomejs.dev/schemas/1.4.1/schema.json",
  "organizeImports": {
    "enabled": true
  },
  "linter": {
    "enabled": true,
    "rules": {
      "recommended": true
    }
  }
}

5. Perspectivas de futuro

La hoja de ruta de Biome es muy clara: sobre la base de estabilizar el Linter y el Formateador, implementará gradualmente un Compilador, Empaquetador, Ejecutor de pruebas y otras funciones, hasta convertirse en una verdadera cadena de herramientas todo en uno.

Aunque todavía es joven, su excelente rendimiento, su modelo abierto impulsado por la comunidad y su atención a la experiencia de desarrollo ya han convertido a Biome en una nueva fuerza imposible de ignorar entre las herramientas frontend. Para los equipos que buscan simplificar su conjunto de herramientas y mejorar la eficiencia del desarrollo, Biome ofrece una opción de futuro muy atractiva.