Mükemmel linteri beklememeye karar verdik: ESLint V9 migrasyonu ve Biome hibrit kullanım deneyimi

ESLint V8 desteğinin sona ermesine yanıt olarak V9’a migrasyon yapıp, performans sorunlarını Biome hibrit kullanımıyla çözen Lemonbase frontend ekibinin deneyimini paylaşıyoruz.

Giriş arka planı

• Eylül 2024’te ESLint V8 desteğinin sona ereceği duyuruldu; güvenlik yamaları ve hata düzeltmeleri almaya devam etmek için V9’a migrasyon zorunlu hale geldi
• V9’dan itibaren .eslintrc.js tabanlı yapılandırma deprecated oldu ve Flat Config varsayılan haline geldi
• Yaklaşık 400 kural, ikiye ayrılmış yapılandırma dosyası yapısı ve çeşitli eklentilerin uyumluluğunun doğrulanması gerekiyordu

Migrasyon süreci

• ESLint’in resmi migrasyon aracı, yalnızca @eslint/compat ile sarmalama düzeyinde kaldığı için beklentileri karşılamadı
• Yapay zeka araçlarıyla taslak oluşturuldu, ancak çok sayıda eksik kural ve uyumluluk sorunu ortaya çıktı
• Sonunda bir elektronik tablo üzerinden V8/V9 kuralları satır satır karşılaştırılarak kapsamlı bir inceleme yapıldı

Migrasyon sonrası performans sorunu

• V9’a yükseltildiğinde, aksine 154 saniyeden 184 saniyeye çıkarak 30 saniye daha yavaşladı
• import/no-cycle kuralı, V8’e kıyasla 10 kat yavaşlayarak toplam sürenin %45,8’ini oluşturdu
• prettier/prettier kuralı da %10,2 ile çift ayrıştırma yükü nedeniyle darboğaz yarattı

Biome hibrit kullanımının devreye alınması

• Tamamen değiştirmek yerine, "birlikte kullanıp faydaya odaklanma" yaklaşımına geçildi
• Prettier → Biome Formatter geçişiyle biçimlendirme süresi 14 saniyeden 2 saniyeye indi
• ESLint ise yalnızca projenin özel kurallarından sorumlu olacak şekilde bırakıldı

Nihai sonuç

• ESLint V8: 154 saniye → ESLint V9: 184 saniye
• Yalnızca ESLint → Biome + ESLint hibrit: ~20 saniye

Öğrenilenler

• Migrasyonu yapay zekaya emanet ederken önce plan çıkarmasını istemek, insan incelemesi yapmak ve başarı kriterlerini açıkça tanımlamak gerekir (ör. V8 sonuçlarıyla eşleşmesi)
• Mükemmel aracı beklemektense, şu anda kullanılabilen araçları iyi bir şekilde birleştirmek bazen daha hızlı bir yol olabilir

Dikkat edilmesi gerekenler

• İki aracı birlikte kullanınca hem eslint.config.mjs hem de biome.json yönetilmelidir ve kural çakışması ihtimali vardır
• Hangi kuralların hangi araç tarafından ele alınacağını net biçimde belirlemek ve yeni ekip üyelerinin onboarding sürecinde bu rol dağılımını açıklamak gerekir

[selene]

Hâlâ lint performansı sorunları yaşıyorsanız, bunun iyi içgörüler sunan bir yazı olduğunu düşünüyorum.

Biz de geçen yıl oxc(oxlint) ile ESLint’i hibrit kullanacak şekilde iyileştirirken, 200 saniyeden fazla süren linting süresini 15 saniyenin altına indirme deneyimi yaşadık.

Ben de ilk başta yapay zekayla kaba kuvvet bir migration yapmıştım ama eksik kalan/değişime uğrayan kurallar sürekli ortaya çıkınca bunları tek tek gözden geçirmeyi düşünürken,
oxc’nin desteklediği kuralları çıkaran bir script’i yapay zekayla yazdırıp oxc’nin desteklemediği kuralları yalnızca ESLint’te etkinleştirecek şekilde düzenleyince, artık düzenli olarak yeni desteklenen kuralları güncellemek de kolaylaştı...

Başlangıçta bu süreç yarı otomatikti ama şimdi bunu Skill olarak tanımladığım için Claude Code ile çalıştırmak yeterli oluyor; böyle olunca yükü de azaldı, bu da hoşuma gitti.

[chamchi]

eslint ve prettier yerine oxlint ve oxfmt kullanmayı düşünmez misiniz?
config’i bire bir karşılayıp hızda da en az onlarca kat daha hızlı oluyor.