2026 yılında frontend build tool ekosistemi üç ana eksende şekilleniyor: Rust tabanlı Turbopack (Next.js varsayılanı), olgun ESM çekirdekli Vite ve webpack uyumluluğunu Rust hızıyla birleştiren Rspack. Turbopack vs Vite karşılaştırması artık tek başına yetmiyor çünkü Rspack, kurumsal webpack migrasyonlarında üçüncü gerçek seçenek olarak konumlandı. State of JS 2024 verilerine göre Vite kullanım oranı %62 ile en yüksek, Turbopack Next.js 15 ile dev modda %53 daha hızlı HMR sunuyor, Rspack ise webpack ekosisteminde 10x build hızı iddia ediyor. Bu yazı, üç aracı production kullanım senaryoları, gerçek benchmark verileri, fiyatlandırma (lisans değil, hosting/CI maliyet etkisi) ve migrasyon maliyeti açısından karşılaştırır; “hangisini seç” sorusuna mühendislik kararlarına dayalı net cevap verir.
Yazının özeti: SSR/SSG ağırlıklı Next.js projeleri için Turbopack, framework-agnostic SPA ve kütüphane projeleri için Vite, mevcut webpack config ve plugin yatırımını korumak isteyen büyük monorepo’lar için Rspack mantıklı tercihtir. Aşağıda her aracın iç mimarisi, gerçek dev/prod build süreleri, ekosistem riskleri ve 2026 yol haritası detaylandırılıyor.
Build Tool Pazarının 2026 Konumu
Modern frontend, 2015-2022 arası webpack hegemonyasından çıkıp parçalı bir yapıya kavuştu. Üç dinamik bu değişimi tetikledi: ESM’in tarayıcıda native desteği (Vite’ın temeli), Rust ile yazılan bundler/parser’ların JavaScript tabanlılardan 10-50 kat hızlı olması (SWC, Turbopack, Rspack), ve framework’lerin (Next.js, Nuxt, SvelteKit, Remix) kendi build pipeline’larını sıkı entegre etmesi. State of JS 2024 anketinde build tool memnuniyet skorları sırasıyla Vite %96, Turbopack %71, Rspack %88 olarak raporlandı. npm haftalık indirme verileri (Kasım 2025): vite ~28M, @rspack/core ~1.2M, Turbopack ise Next.js içinde gömülü olduğundan ayrı sayım dışı; Next.js indirmesi haftalık ~9.1M.
Karar verirken sadece “hangisi daha hızlı” sorusu yetersiz. Asıl sorular: hangi framework kullanılıyor, mevcut config ne kadar karmaşık, ekip kaç kişi, CI/CD bütçesi nedir, plugin ekosistemi gereksinimleri neler. Bu yazı bu eksenlerin hepsini somut sayılarla karşılaştırır.
| Araç | Çekirdek Dil | İlk Stabil | 2026 Versiyon | Primary Use | Sponsor |
|---|---|---|---|---|---|
| Turbopack | Rust | Next.js 15 (Eki 2024) | Next.js 15.x | Next.js dev + build | Vercel |
| Vite | JS/TS + esbuild + Rolldown (Rust geçişi) | Şub 2021 | 6.x | Framework-agnostic dev + build | VoidZero (Evan You) |
| Rspack | Rust | Ağu 2023 | 1.x | webpack drop-in replacement | ByteDance |

Turbopack: Next.js’in Native Engine’i
Turbopack, Vercel’in webpack yaratıcısı Tobias Koppers liderliğinde geliştirdiği Rust tabanlı bundler. Mimari olarak Turborepo‘nun cache motoru üzerine inşa edildi; sonuç, function-level incremental computation. Yani fonksiyon değişmediyse yeniden çalıştırılmıyor — sadece transformed AST cache’ten okunuyor. Bu yaklaşım Salsa (Rust analyzer) ve Bazel’in cache modeline benzer.
Next.js 15 ile next dev --turbo stable, next build --turbo ise beta. Vercel’in resmi blog post’una göre Next.js 15.1’de Turbopack, 1000 dosyalık projede webpack’e kıyasla:
- Soğuk başlatma: webpack 18.5s → Turbopack 4.1s (~%78 hızlı).
- HMR (kod değişikliği yansıma): webpack 1.2s → Turbopack 180ms (~%85 hızlı).
- Route navigation: webpack 850ms → Turbopack 320ms (~%62 hızlı).
- Production build: Beta — webpack ile yaklaşık eş, henüz bazı edge case’lerde regresyon mevcut.
Avantaj: Next.js ile sıfır konfigürasyon entegrasyon, React Server Components için optimize edilmiş graph, Vercel deploy pipeline’ı ile sıkı bağ.
Dezavantaj: Next.js dışında kullanılamaz (henüz bağımsız CLI yok), bazı webpack loader’ları desteklenmiyor (özellikle next.config.js‘teki custom webpack config’ler kısmen taşınmıyor), plugin API olgunlaşmamış.
Ne zaman seç: Yeni Next.js projesi başlatıyorsan veya mevcut Next.js projende webpack config büyük değilse default olarak Turbopack açık tut.
Turbopack’in 2026 yol haritasında next build --turbo‘nun stable gelmesi ve standalone CLI (Next.js olmadan kullanım) hedefleniyor. Vercel’in resmi Turbopack dokümantasyonu versiyon-by-versiyon stabilite matrisini sürüyor.
Vite: Olgun ESM Native Dev Server
Vite’ı 2020’de Evan You (Vue.js kurucusu) çıkardı; bugün VoidZero şirketi üzerinden geliştiriliyor. İki temel fikre dayanır: (1) Development modunda bundle yapma — tarayıcıya native ES module olarak dosyaları doğrudan servis et, böylece soğuk başlatma ~30ms. (2) Production modunda Rollup ile bundle yap (Vite 6’dan itibaren Rolldown — Rust ile yeniden yazılmış Rollup — varsayılan olmaya geçiyor).
Vite, framework-agnostic; React, Vue, Svelte, Solid, Lit, Preact, Qwik için resmi şablonları var. SvelteKit, Nuxt 3, Astro, Remix (v3 deneysel), Vike, Solid Start — bunların hepsi Vite üzerine kurulu. State of JS 2024 verisine göre Vite kullanan geliştirici oranı %62, memnuniyet %96.
| Metric | Vite 6 (Rolldown) | Vite 5 (esbuild + Rollup) | Webpack 5 |
|---|---|---|---|
| Dev server soğuk başlatma | ~30-80ms | ~100-200ms | 3-15s |
| HMR latency | ~50ms | ~80ms | 500-1500ms |
| Production build (orta proje, 500 dosya) | ~8-12s | ~25-35s | 40-90s |
| Production build (büyük proje, 5000 dosya) | ~60-90s | ~180-240s | 4-8 dakika |
| Tree-shaking kalitesi | Yüksek (Rolldown) | Yüksek (Rollup) | Orta |
Avantaj: Olgun plugin ekosistemi (Rollup plugin uyumlu), framework-agnostic, dev server zero-config, Storybook 8+ resmi destek, TypeScript/JSX/Vue/Svelte sıfır config. Rolldown geçişi ile production build hızı 2-3x artıyor.
Dezavantaj: Dev’de native ESM kullandığı için bazen ESM olmayan bağımlılıklarda manuel optimizeDeps konfigürasyonu gerekir. SSR konfigürasyonu meta-framework’sis (Nuxt, SvelteKit) yapılması göreceli karmaşık.
Ne zaman seç: Next.js dışı her framework için varsayılan tercih; React projeleri için Vite + React Router/TanStack Router kombinasyonu Next.js’in alternatifi.
Vite 6 ve Rolldown ile ilgili güncel teknik detaylar için vite.dev resmi sitesi ve Rolldown projesi takip edilebilir.

Rspack: Rust Hızında webpack
Rspack, ByteDance tarafından geliştirildi; iddiası şu: “webpack ile %95+ API uyumluluğu + Rust ile 5-10x hız”. Hedef kullanıcı: webpack kullanan büyük monorepo’lar, eski enterprise projeler, ve webpack plugin ekosistemini terk edemeyenler.
Rspack 1.0 (Ağustos 2024) ile stable; webpack 5 API uyumluluğu çoğu kurumsal senaryoda drop-in replacement seviyesinde. webpack.config.js dosyası genellikle rspack.config.js olarak yeniden adlandırılıp birkaç loader değişikliği ile çalıştırılabiliyor. Modern.js (ByteDance), Rsbuild (Rspack üzerine yüksek seviye API) ve Rsdoctor (build analyzer) ile birlikte ailenin tamamı destekleniyor.
ByteDance’ın iç verilerine göre TikTok web ve Lark web uygulamalarında webpack’ten Rspack’e geçiş sonrası:
- Build süresi: 10-15 dakikadan 90-150 saniyeye (~%85-90 azalma).
- HMR latency: 1-3 saniyeden 200-400 ms’ye düşüş.
- CI maliyeti: Build sürelerinin azalması ile aylık CI compute fatura ~%40 düşüş.
- Geliştirici memnuniyeti (iç anket): 6.2/10’dan 8.7/10’a çıkış.
Avantaj: webpack plugin ve loader’larının çoğu doğrudan çalışıyor (mini-css-extract, image-loader, webpack-bundle-analyzer dahil), Rust hızı, kurumsal monorepo’lar için olgun (Nx, Turborepo entegrasyonları), Module Federation 2.0 first-class destek.
Dezavantaj: Vite kadar zero-config değil — yine de webpack tarzı detay konfigürasyon yazmak gerekir; plugin API Rust + JS köprüsü olduğundan custom Rust plugin yazmak karmaşık (çoğunlukla JS plugin yeterli); topluluk Vite kadar büyük değil.
Ne zaman seç: Mevcut webpack config büyükse (binlerce satır), Module Federation kritikse, veya kurumsal politika “webpack API’sini koru, sadece motoru değiştir” diyorsa.
Performance Benchmark: Üç Aracın Yarışı
Aşağıdaki tablo, bağımsız topluluk benchmark’larından (özellikle sokra/bundler-comparison ve vite-vs-next-turbo-hmr repolarından) ve vendor publish ettiği verilerden derlenen ortalama değerleri içerir. Donanım: M3 Max 64GB, 5000 dosyalık React + TypeScript projesi.
| Senaryo | webpack 5 | Turbopack | Vite 6 (Rolldown) | Rspack 1.x |
|---|---|---|---|---|
| Dev server soğuk başlatma | 8.4s | 2.1s | 0.4s | 1.8s |
| HMR (component edit) | 1100ms | 140ms | 55ms | 180ms |
| HMR (CSS edit) | 620ms | 90ms | 30ms | 110ms |
| Production build | 240s | ~85s | 72s | 62s |
| Bundle size (gzip) | 314 KB | 308 KB | 296 KB | 312 KB |
| Bellek tepe noktası | 3.2 GB | 1.4 GB | 0.9 GB | 1.1 GB |
Dikkat: Bu rakamlar indikatif. Gerçek bir projede %20-40 sapma normaldir. Asıl çıkarımlar: (1) Dev modda Vite hâlâ açık ara önde, çünkü “bundle yapmama” stratejisi yapısal bir avantaj. (2) Production build’de Rspack en hızlı, Vite 6 ile yakın; Turbopack beta nedeniyle bazı senaryolarda gerileyebiliyor. (3) Bellek tüketiminde Vite en verimli, ardından Rspack, ardından Turbopack geliyor.
Build süresinin ekonomik etkisi göz ardı edilmemeli: Aylık 5000 CI build çalıştıran bir orta ölçek SaaS için webpack→Rspack geçişi GitHub Actions standard runner fiyatlarıyla aylık $400-700 tasarruf demek (3 dakika × 5000 = 15000 dk = 250 saat; $0.008/dk × 250 = $2000 yerine $400 civarı). Bu nokta Özel Yazılım Fiyatları 2026 yazısında detaylandırılan operasyonel maliyet hesaplarıyla doğrudan örtüşür.
Benchmark yorumlanırken iki uyarı önemli. Birincisi, “5000 dosyalık React + TypeScript projesi” sentetik bir referans; gerçek projelerde CSS-in-JS, image asset pipeline, çoklu i18n bundle, monorepo paket sayısı gibi değişkenler süreyi 1.5x-3x kaydırabilir. İkincisi, Turbopack production build beta olduğu için bazı edge case’lerde regresyon (özellikle exotic webpack loader’larla karışık projelerde) gözleniyor; bu nedenle next build --turbo kararı CI’da bir süre next build ile paralel koşturulup karşılaştırmalı doğrulanmalı.
Mimari Karşılaştırma: İç Çalışma Modelleri
Üç aracın mimari kararları farklı: Turbopack incremental computation graph, Vite ESM-native dev + Rolldown production, Rspack webpack-compatible Rust bundler. Bu farklar, ekibinizin probleminize hangi aracın uyduğunu belirler.
| Boyut | Turbopack | Vite | Rspack |
|---|---|---|---|
| Parsing | SWC (Rust) | esbuild (Go) + SWC opsiyonel | SWC (Rust) |
| Bundling stratejisi | Incremental graph (Turbo engine) | Dev: bundle yok / Prod: Rolldown | webpack-compatible chunk graph |
| Cache | Function-level memoization | esbuild + dep optimization cache | Persistent file cache |
| HMR mekanizması | Modül seviyesinde patch | Native ESM module replacement | webpack HMR API |
| Plugin API | Olgunlaşmamış (Rust + JS) | Rollup plugin (olgun, ~2000+ plugin) | webpack-compatible (~5000+ plugin) |
| Code splitting | Otomatik (Next.js route-based) | Otomatik + manuel manualChunks | webpack splitChunks API |
Mimari kararların pratik sonucu: Vite, dev’de daimi olarak en hızlı çünkü hiç bundle yapmıyor. Turbopack, Next.js’in App Router yapısıyla derin entegre çünkü Vercel ekibi her ikisini de aynı çatı altında geliştiriyor. Rspack, webpack API’sini koruduğu için 1000+ plugin doğrudan çalışıyor — bu, büyük kurumsal projelerin migrasyon riskini azaltıyor.

Framework ve Ekosistem Uyumu
Build tool seçimi, framework seçiminden bağımsız değil. Aşağıdaki matris, framework + build tool kombinasyonlarının olgunluğunu özetler.
| Framework | Default Build Tool | Turbopack Desteği | Vite Desteği | Rspack Desteği |
|---|---|---|---|---|
| Next.js 15 | Turbopack | Native (stable dev, beta build) | Yok (Vercel desteklemiyor) | Topluluk (deneysel) |
| Nuxt 3 | Vite | Yok | Native | Deneysel |
| SvelteKit | Vite | Yok | Native | Yok |
| Remix v3 / React Router 7 | Vite | Yok | Native | Yok |
| Astro | Vite | Yok | Native | Yok |
| Storybook 8+ | Vite veya webpack | Plan | Native | Native |
| Modern.js (ByteDance) | Rspack | Yok | Yok | Native |
| Create React App (deprecated) | webpack | Yok | Migrasyon var | Native (rspack-cra-template) |
Bu matristen çıkan pratik kural: Framework seçimi build tool seçimini büyük oranda belirliyor. Next.js seçtiysen Turbopack zaten geliyor; Vite framework’lerinden birini seçtiysen Vite default; webpack-tabanlı eski projende kalıyorsan Rspack en az riskli geçiş.
Migrasyon Senaryoları
Üç tipik durum: (A) Yeni proje başlatma, (B) webpack’ten geçiş, (C) Create React App’ten geçiş (CRA Şubat 2025’te resmen deprecated).
- Senaryo A — Yeni proje: Next.js gerekiyorsa Turbopack. Server-driven UI değil SPA gerekiyorsa Vite + React Router. Çok dilli, çok platformlu, server-rendered ihtiyacı varsa Nuxt/SvelteKit (Vite). Build tool seçimi yapma, framework seç, build tool gelir.
- Senaryo B — webpack’ten geçiş: Plugin envanteri yapılır → Rspack adapter listesinde olmayan plugin var mı bakılır. Çoğu kurumsal projede Rspack drop-in çalışır. Custom loader’lar varsa SWC equivalent’ları araştırılır.
- Senaryo C — CRA’dan geçiş: Vite +
vite-plugin-reacten yaygın tercih. Resmi migrasyon rehberi sayesinde ortalama 1-2 günlük iş. Alternatif:rspack-cra-templatehiç config dokunmadan webpack uyumluluğu sunar. - Senaryo D — Vue 2 / Vue CLI’den geçiş: Vue CLI 2024’te resmen archived, Vite +
@vitejs/plugin-vuetek mantıklı seçenek.
Migrasyon planlaması, eski sistemlerin modernleştirilmesi sürecinin parçası; bu sürecin yönetimi için yazılım refactoring ve legacy modernleştirme yaklaşımı ile kod kalitesi metrikleri takibi paralel yürütülmeli.
Maliyet ve Operasyonel Etkiler
Build tool sadece geliştirici deneyimi (DX) değil, operasyonel finansal etkisi olan bir karar. CI/CD compute, container build süresi, deployment frekansı doğrudan etkilenir.
| Maliyet Kalemi | webpack 5 | Turbopack | Vite 6 | Rspack 1.x |
|---|---|---|---|---|
| CI build süresi (orta SaaS, 5000 build/ay) | ~5 dk × 5000 = 25000 dk | ~1.7 dk × 5000 = 8500 dk | ~1.5 dk × 5000 = 7500 dk | ~1.3 dk × 5000 = 6500 dk |
| GitHub Actions standard runner aylık ($0.008/dk) | ~$200 | ~$68 | ~$60 | ~$52 |
| Developer wait time (10 dev × günlük 20 build × HMR) | ~50 dk/dev/gün | ~6 dk/dev/gün | ~3 dk/dev/gün | ~7 dk/dev/gün |
| Aylık ekip productivity tasarruf (10 dev, $80/saat) | baseline | ~$15,000 | ~$15,500 | ~$14,500 |
| Migrasyon başlangıç maliyeti | — | düşük (Next.js) | orta (config rewrite) | düşük (drop-in) |
Yukarıdaki rakamlar 2025-2026 GitHub Actions ve ortalama orta seviye Türkiye/Avrupa developer maliyetleriyle hesaplandı. Modern build tool’a geçiş, orta ölçek bir ekip için 6 ay içinde geri ödeyen bir yatırım. Build hızı yalnızca DX değil, deploy frekansı (DORA metrikleri) üzerinde de etkili — daha hızlı build = daha sık deploy = daha küçük PR’lar = daha az risk.

Yan Konular: TypeScript, Test, SSR, Edge
Build tool seçimi şu yan konuları da etkiler:
- TypeScript transformation: Üçü de SWC veya esbuild ile yapar —
tscyerine paralel/native transpile. Type-check ayrı süreç (geneldetsc --noEmitCI’da paralel). Bkz. Python tip kontrolü mantığı ile paralel: build hızı için type-check ayrı job. - Test runner uyumu: Vitest, Vite’ın test runner’ı — sıfır config. Jest hala webpack/babel ile çalışıyor; Rspack ile Jest uyumu deneysel. Turbopack için Next.js test setup’ı Jest veya Vitest seçeneği sunuyor.
- SSR ve streaming: Turbopack, React Server Components için özel optimize. Vite SSR API’si
vite-plugin-ssr/vikeile olgunlaştı. Rspack SSR için ekstra konfigürasyon gerektirir. - Edge runtime / Cloudflare Workers: Vite +
@cloudflare/vite-pluginresmi destek. Turbopack edge route’lar için Next.js Vercel deploy’unda otomatik. Rspack edge target henüz beta. - Worker / Service Worker: Üçünde de
?workerimport veya plugin ile destek var, ancak Vite +vite-plugin-pwakombinasyonu en olgun.
Build tool kararı, yazılım tasarım desenleri seçimi gibi bağlam-bağımlı. Yanlış araç, ekosistem savaşı doğurur; doğru araç, sessiz altyapı olur. Ömer Önal’ın danışmanlık projelerinde sık karşılaştığı bir gözlem: ekipler tool’u “trendy” diye değil, mevcut framework ve plugin envanteri ile uyum üzerinden seçtiğinde net memnuniyet artıyor.
Sık Sorulan Sorular (SSS)
Turbopack’i Next.js dışında bağımsız kullanabilir miyim?
2026 başı itibarıyla hayır. Turbopack şu an Next.js 15 ile sıkı entegre, bağımsız CLI yok. Vercel’in yol haritasında “standalone Turbopack” var ancak resmi ETA yok. Next.js dışı bir projede Rust hızı için Rspack veya Vite + Rolldown daha gerçekçi seçenekler.
Vite’ı production’da kullanmak güvenli mi?
Evet, Vite Şubat 2021’den beri stable ve 5+ yıldır production’da binlerce şirkette kullanılıyor. Vite 6 (Rolldown geçişi) ile Rollup yerine Rust bundler, production build hızı 2-3x artıyor. Ekosistem olgunluğu (Rollup plugin uyumluluğu) sayesinde plugin riski düşük.
Rspack, webpack’ten geçişte hangi pluginler çalışmaz?
Rspack 1.0 itibarıyla webpack 5 API’sinin %95+’i destekleniyor. Çalışmayanlar genellikle çok özel custom plugin’ler veya webpack 4’e özgü deprecated API kullananlar. mini-css-extract, html-webpack-plugin, terser, image-loader, webpack-bundle-analyzer dahil yaygın pluginlerin tümü çalışıyor.
Hangisi en az bellek tüketir?
Vite, dev modunda native ESM kullandığı için en az bellek tüketir (~900 MB tepe noktası, 5000 dosyalık projede). Rspack ~1.1 GB, Turbopack ~1.4 GB civarındadır. webpack ise aynı projede 3 GB üzerine çıkar. Düşük bellek, paralel CI job’larda daha çok eş zamanlı runner anlamına gelir.
2026’da yeni bir React projesi başlatıyorum, hangisini seçeyim?
SSR/SSG kritikse ve Vercel/AWS Amplify gibi platforma yatkınsan Next.js 15 + Turbopack. SPA + REST/GraphQL ise Vite + React Router 7 veya TanStack Router. Kurumsal monorepo ve mevcut webpack altyapısı varsa Rspack. “Tek doğru” yok; framework + deploy hedefi + ekip tecrübesi birlikte değerlendirilir.
Sonuç
Turbopack vs Vite vs Rspack tartışmasının 2026’daki cevabı tek araç değil, üç farklı problem alanı için üç doğru araç. Turbopack, Next.js ekosistemi için Vercel tarafından optimize edilmiş native bundler; Vite, framework-agnostic dev hızı için sektör standardı; Rspack, webpack yatırımını koruyarak Rust hızını isteyen kurumsal ekipler için drop-in çözüm. Üçü de Rust/SWC çekirdekli olduğundan webpack 5 referans noktasıyla karşılaştırıldığında 5-10x hız kazancı sunuyor.
Karar matrisi sade: (1) Next.js seçtiysen Turbopack default, terk etmek için sebep aranır. (2) Vite tabanlı bir framework seçtiysen (Nuxt, SvelteKit, Astro, Remix v3) Vite zaten geliyor. (3) Büyük webpack monorepo’sundan geçiş yapıyorsan Rspack en az riskli rotadır. Migrasyon kararı tek başına bir araç meselesi değil; teknik karar süreçleri ve mimari hedeflerle birlikte düşünülmeli.
Build tool migrasyonu, frontend mimarisi modernizasyonu veya Next.js / Vite tabanlı yeni proje için yol haritası çıkarmak istiyorsanız iletişim sayfası üzerinden bağlantıya geçebilirsiniz.










Ömer ÖNAL
Mayıs 16, 2026Yazılım geliştirme projelerinde sıkça gözlemlediğim: kod kalitesi metrikleri (cyclomatic complexity, test coverage) baseline’ı belirlenmeden refactoring kararı veriliyor. Bu yaklaşım %40’ı aşan rework oranıyla sonuçlanıyor. Static analysis araçlarını CI pipeline’a entegre etmek ilk adım. Yorumlarınız?