Mit Biome steht ein neues Tool bereit, das Formatter, Linter und Typprüfung in einem System vereint – schnell, leichtgewichtig und auf moderne Entwicklerbedürfnisse zugeschnitten.
Ein gut funktionierender Linter- und Formatter-Workflow ist elementarer Bestandteil jeder stabilen Frontend-Codebasis. Werkzeuge wie Prettier und ESLint haben sich lange als Standard etabliert, bringen jedoch eine gewisse Komplexität im Setup mit – und stoßen bei wachsender Projektgröße schnell an Performancegrenzen.
Mit Biome steht ein neues Tool bereit, das Formatter, Linter und Typprüfung in einem System vereint – schnell, leichtgewichtig und auf moderne Entwicklerbedürfnisse zugeschnitten.
Was ist Biome?
Biome ist ein in Rust entwickeltes Tool, das Formatter- und Linting-Funktionalitäten in einem einzigen Paket bündelt. Es unterstützt JavaScript, TypeScript, JSX/TSX, JSON, GraphQL und CSS – mit dem erklärten Ziel, bestehende Lösungen wie Prettier und ESLint vollständig abzulösen.
Vorteile im Überblick:
- Schnell: Bis zu 25× schneller als Prettier und 15× schneller als ESLint
- Kompatibel: Unterstützt rund 97 % der Prettier-Formatierung
- All-in-One: Nur eine Konfiguration (statt Prettier + ESLint getrennt)
- Tooling: Editor-Plugins, LSP-Support, CI-Tools, Auto-Fix und Import-Sortierung
Formatierung und Linting im Detail
Biome führt beide Aufgaben – Formatieren und Linting – in einem System aus:
- Formatter: Robuste Formatierung, auch bei nicht vollständig validem Code
- Linter: Über 270 integrierte Regeln (basierend auf bekannten ESLint-Standards)
- Check-Commands:
format,lint,check,ci– klare Trennung, ideal für automatisierte Workflows - Import Management: Automatische Sortierung von Imports inklusive
CSS-Unterstützung: Noch kein Stylelint-Ersatz
Biome bietet grundlegende Unterstützung für CSS-Dateien: Syntaxformatierung und einfache Strukturregeln funktionieren zuverlässig. Ein vollständiger Ersatz für Stylelint ist aktuell jedoch nicht vorgesehen.
Aktueller Stand:
- Formatieren: Ja (Farben, Einrückung, Klammerung etc.)
- Linting: Ja, aber eingeschränkt – keine vollständigen Stylelint-Regeln wie BEM, Konventionen, Design Tokens
- Empfehlung: Für anspruchsvolle CSS-Linting-Szenarien weiterhin Stylelint parallel einsetzen
Installation und Einrichtung
Biome wird per npm installiert und über eine zentrale biome.json-Datei konfiguriert:
npm install --save-dev --save-exact @biomejs/biome
npx biome init
Die Konfiguration erfolgt vollständig in biome.json:
{
"formatter": {
"enabled": true
},
"linter": {
"rules": {
"recommended": true
}
}
}
Migration von bestehenden Setups:
Biome bietet ein CLI-Tool zur Migration:
npx biome migrate prettier --write
npx biome migrate eslint --write
Editor- & CI-Integration
VS Code
- Eigene Extension mit Format-on-Save, Quick Fixes, Import-Sortierung
- Funktioniert auch ohne weitere Plugins zuverlässig
Neovim & andere
- Voller LSP-Support für moderne Setups
- Kompatibel mit Tools wie null-ls oder über CLI
Zed Editor
Zed, ein moderner, performance-orientierter Code-Editor mit Fokus auf Kollaboration und Rust-native Architektur, bietet bereits solide Unterstützung für LSP-basierte Tools. Biome lässt sich via Language Server Protocol (LSP) in Zed integrieren – Formatierung und Linting laufen performant und ohne separate Plugin-Installation.
Weitere Setups
- Biome eignet sich hervorragend für Git Hooks (pre-commit) und CI-Checks
- In CI/CD-Pipelines einfach per
npx biome ci ./srcausführbar
Vergleich: Biome vs. Prettier + ESLint
| Feature | Prettier + ESLint | Biome |
|---|---|---|
| Geschwindigkeit | langsam bei großen Projekten | sehr schnell (Rust-basiert) |
| Konfiguration | zwei Tools, mehrere Dateien | eine JSON-Datei |
| Import-Sortierung | Plugin-basiert | nativ |
| Editor-Integration | sehr gut | sehr gut |
| CSS-Stylelint-Ersatz | vollständig | eingeschränkt |
| Plugins | große Auswahl | noch begrenzt |
Aktuelle Nutzung und Erfahrungsstand
Biome wird bereits erfolgreich in modernen JavaScript- und TypeScript-Projekten eingesetzt. In produktionsnahen Setups läuft es aktuell parallel zu:
- WebStorm: Biome via CLI eingebunden
- Cursor AI: Unterstützung über integrierte Tools + Kommandozeile
- VS Code / Neovim: über LSP oder Extension
- Zed: bevorzugt für performante, kollaborative Arbeit – besonders im Rust-Umfeld relevant
Schlussgedanke
Biome ist ein leistungsfähiges Tool für Projekte, die Wert auf Geschwindigkeit, Konsistenz und einfache Konfiguration legen. Es ersetzt klassische Formatter/Linter-Kombinationen mit einer modernen, wartungsarmen Lösung.
Für Projekte mit großem JavaScript-/TypeScript-Anteil bietet Biome ein zukunftssicheres Fundament – besonders, wenn Build-Zeiten, Editor-Performance und CI-Konsistenz im Fokus stehen.
Empfehlung:
- Für neue oder mittelgroße JS/TS-Projekte: uneingeschränkt empfehlenswert
- Für CSS/SCSS-lastige Frontend-Projekte: ggf. weiterhin Stylelint ergänzend einsetzen
- Für bestehende Setups: Migration mit Bedacht, aber lohnenswert
Weiterführende Links
Realistischer Migrations-Aufwand auf Biome
Aus konkreten Projekt-Migrationen (ESLint+Prettier → Biome):
- Kleines Projekt (< 50 Files): 1–2 Stunden. Config-Migration, CI-Anpassung, eventuell Editor-Konfiguration.
- Mittleres Projekt (200–500 Files): 4–8 Stunden. Plus Custom-Regel-Migration, Team-Schulung.
- Großes Projekt mit vielen Custom-ESLint-Plugins: 1–3 Tage. Nicht alle ESLint-Regeln haben Biome-Äquivalente — manche Custom-Plugins müssen weiterlaufen oder weggelassen werden.
Performance-Vergleich in Zahlen
- Lint-Geschwindigkeit: Biome ist typisch 10–25x schneller als ESLint. Bei einem Projekt mit 1.000 Files reduziert sich die Lint-Zeit von 30–60 Sekunden auf 1–3 Sekunden.
- Format-Geschwindigkeit: Vergleichbar mit Prettier oder leicht schneller — der größere Effekt ist die Kombination Format+Lint in einem Pass.
- Memory-Footprint: Biome braucht etwa 50–80 MB RAM für mittlere Projekte. ESLint+Prettier oft 200–400 MB.
Wann Biome (noch) nicht passt
- Bei stark Custom-Plugin-abhängigen Setups: ESLint hat tausende Custom-Plugins. Biome’s Regel-Ökosystem ist deutlich kleiner.
- Bei JSX/TSX in nicht-Standard-Konfiguration: Biome unterstützt JSX gut, aber Edge-Cases (Class-Components, sehr alte React-Patterns) können noch nicht funktionieren.
- Bei Vue, Svelte, Astro Single-File-Components: Biome’s Support hier ist im Aufbau, aber noch nicht so ausgereift wie ESLint mit entsprechenden Plugins.
- Bei strikten Code-Style-Anforderungen: Manche Teams haben über Jahre ESLint-Konfigurationen aufgebaut, die nicht 1:1 nach Biome portierbar sind.
Wo der Wechsel zu Biome klar lohnt
- Bei neuen Projekten ohne Legacy-Lint-Konfiguration: Sofort Biome wählen.
- Bei langsamen CI-Pipelines: Lint-Zeit dramatisch reduziert.
- Bei kleineren Teams ohne Lust auf ESLint+Prettier+TypeScript+Stylelint-Stack: Biome ersetzt mehrere Tools mit einem.
Realistische Adoption
Stand 2026: Biome ist von Größen wie GitHub, Discord und Astro adoptiert. ESLint bleibt der Marktführer, aber Biome’s Wachstum ist messbar (laut npm-Downloads Verzehnfachung 2024 → 2025).