Flutter ve React Native Farkı Nedir?
Mobil uygulama geliştirmede Flutter mı, React Native mi yoksa Native (Swift/Kotlin) mi seçilmeli? Impeller motoru, performans, maliyet ve mimari karşılaştırma.
Yozel
13 dk

İçindekiler (25)
Yeni bir mobil yazılım projesi başlatan teknoloji liderleri (CTO), yazılım mimarları ve girişimciler için en stratejik mimari kararların başında Flutter ve React Native farkı nedir sorusu ile çapraz platform (Cross-Platform) teknolojilerinin Native (Swift / Kotlin) geliştirmeye kıyasla sunduğu avantaj ve sınırlar gelir. Geçmiş yıllarda çapraz platform çerçeveleri yalnızca basit MVP (Minimum Viable Product) projeleri için tercih edilirken, 2026 yılı itibarıyla Google’ın geliştirdiği Flutter (Impeller grafik motoru ile) ve Meta’nın geliştirdiği React Native (JSI, Fabric ve TurboModules Yeni Mimarisi ile), Native uygulamalardan ayırt edilemeyecek düzeyde 120 FPS arayüz akıcılığı ve düşük gecikme süresi sunabilmektedir.
Mobil ekosistemde doğru teknoloji yığınını (tech stack) seçmek; projenin pazara çıkış süresini (Time-to-Market), geliştirici istihdam maliyetini, uzun vadeli bakım yükünü ve uygulamanın cihaz kaynaklarını tüketim verimliliğini doğrudan belirler. Özellikle mobil uygulama trendleri ve yüksek dönüşüm odaklı mobil e-ticaret tasarımında UI/UX trendleri göz önüne alındığında, her bir çerçevenin kaputun altında nasıl çalıştığını mühendislik perspektifiyle incelemek şarttır.
1. Mimari Temeller: Grafik Çizim Motoru (Canvas) vs. OEM Native Bileşenler
Flutter ve React Native arasındaki en köklü fark, kullandıkları programlama dilinden (Dart vs. TypeScript/JavaScript) ziyade, ekrandaki pikselleri nasıl çizdikleri (Rendering Pipeline) noktasında ortaya çıkar.
Flutter Mimarisi: Dart, Skia ve Yeni Nesil "Impeller" Motoru
Google tarafından geliştirilen Flutter, işletim sisteminin (iOS UIKit/SwiftUI veya Android View) hazır butonlarını, metin kutularını veya kaydırma listelerini kullanmaz. Bunun yerine Flutter, tıpkı bir oyun motoru (Unity veya Unreal Engine) gibi işletim sisteminden yalnızca boş bir çizim tuvali (Canvas) ve dokunma/sensör olaylarını ister. Ekranda gördüğünüz her pikseli, gölgeyi, yazı tipini ve geçiş animasyonunu kendi yerleşik 2D/3D grafik motoruyla doğrudan GPU (Grafik İşlemci) üzerinde çizer.
- Dart ve AOT Derleme: Flutter’ın kullandığı Dart dili, geliştirme aşamasında JIT (Just-in-Time) derleme ile milisaniyeler içinde Stateful Hot Reload sunarken, yayın (release) aşamasında doğrudan ARM64 makine koduna AOT (Ahead-of-Time) olarak derlenir.
- Impeller Grafik Motoru Devrimi: Flutter’ın önceki sürümlerinde kullanılan Skia motorunda, ilk kez oynatılan karmaşık animasyonlarda gölgelendirici derleme takılması (Shader Compilation Jank) yaşanabiliyordu. Flutter’ın yeni varsayılan motoru Impeller, tüm gölgelendiricileri (Shaders) uygulama inşa edilirken önceden derler (pre-compile) ve Apple’ın Metal ile Android’in Vulkan düşük seviyeli grafik API’leriyle doğrudan konuşur. Sonuç olarak hem iOS hem de Android’de sabit 120 FPS kare hızı garanti altına alınır.
- Piksel Kusursuzluğunda Tutarlılık: Flutter kendi bileşenlerini (Widget) çizdiği için, yazdığınız bir arayüz kodu en son çıkan iPhone 16 Pro’da da, 5 yıllık bir Android telefonda da piksel pikseline birebir aynı görünür.
React Native Mimarisi: JavaScript/TypeScript, JSI ve Fabric (Yeni Mimari)
Meta (Facebook) tarafından geliştirilen ve Instagram, Shopify, Discord, Microsoft Office gibi devasa uygulamalarda kullanılan React Native ise tamamen farklı bir felsefe benimser: Gerçek OEM Native Bileşenleri kullanmak. React Native’de bir <TextInput> veya <ScrollView> yazdığınızda, bu kod iOS’ta gerçek bir UITextView’a, Android’de ise gerçek bir android.widget.EditText bileşenine dönüştürülür.
- Eski Köprü (Bridge) Mimarisinin Sonu: React Native’in ilk yıllarında JavaScript katmanı ile Native katman, JSON mesajlarını asenkron olarak serileştiren bir "Bridge (Köprü)" üzerinden haberleşiyordu. Yoğun kaydırma ve animasyonlarda bu köprüde darboğaz oluşuyordu.
- Yeni Mimari (JSI, Fabric ve TurboModules): Günümüzde React Native’de varsayılan olarak aktif gelen Yeni Mimari, C++ tabanlı JSI (JavaScript Interface) katmanını kullanır. Artık JavaScript kodu, JSON serileştirmeye ihtiyaç duymadan C++ bellek referansları üzerinden Native metodları senkron ve doğrudan çağırabilir.
- Hermes Motoru: Mobil cihazlar için özel olarak optimize edilmiş açık kaynaklı Hermes JavaScript motoru, kodu önceden Bytecode formatına derleyerek uygulamanın ilk açılış süresini (TTI - Time to Interactive) yarı yarıya düşürür ve bellek (RAM) tüketimini önemli ölçüde azaltır.
2. Native Geliştirme (SwiftUI & Jetpack Compose) ve Kotlin Multiplatform (KMP)
Flutter ve React Native rekabetini değerlendirirken denklemin diğer tarafındaki Tam Native ve yükselen yıldız Kotlin Multiplatform (KMP) yaklaşımlarını da konumlandırmak gerekir:
Tam Native (iOS için Swift/SwiftUI, Android için Kotlin/Jetpack Compose)
İşletim sistemi üreticilerinin (Apple ve Google) kendi dilleri ve bildirimsel (declarative) arayüz araçlarıyla geliştirme yapmaktır. İki ayrı kod tabanı ve iki ayrı uzman ekip gerektirir. Ancak karşılığında:
- Yeni bir iOS veya Android sürümü tanıtıldığı gün (örneğin dinamik ada API’leri, yeni nesil widget’lar, Apple Intelligence / Gemini Nano entegrasyonları) sıfır bekleme süresiyle tüm API’lere erişim sağlar.
- Kamera, Bluetooth (BLE), ARKit/ARCore artırılmış gerçeklik, ses işleme ve arka plan servislerinde en düşük pil tüketimi ve en yüksek donanım verimliliğini sunar.
Kotlin Multiplatform (KMP) ve Compose Multiplatform
JetBrains tarafından geliştirilen ve Google tarafından resmi olarak desteklenen Kotlin Multiplatform, hibrit ve pragmatik bir yaklaşım sunar: İş mantığını (Business Logic), ağ katmanını, veritabanı işlemlerini ve şifreleme algoritmalarını tek bir Kotlin kod tabanında paylaşmanıza; arayüzü (UI) ise isterseniz iOS’ta tam Native SwiftUI, Android’de Jetpack Compose ile yazmanıza (veya Compose Multiplatform ile arayüzü de paylaşmanıza) olanak tanır.
3. Performans, Bellek Tüketimi ve Pil Verimliliği Kıyaslaması
Son kullanıcı deneyimini doğrudan etkileyen telefon şarjı neden hızlı biter veya uygulama neden takılır gibi soruların cevabı, kullanılan çerçevenin CPU, GPU ve RAM üzerindeki yükünde saklıdır:
- CPU (İşlemci) Yoğunluklu İşlemler: Kriptografik hesaplamalar, büyük JSON dosyalarının ayrıştırılması ve karmaşık algoritmalarda Native (Swift/Kotlin) birinci sıradadır. Çapraz platformlar arasında ise Flutter (Dart AOT), doğrudan derlenmiş makine kodu çalıştırdığı için React Native’in JavaScript motoruna (Hermes) kıyasla ağır matematiksel işlemlerde %15 ila %30 daha hızlı sonuç verir.
- Arayüz ve Animasyon Akıcılığı (FPS): Özel tasarlanmış, marka kimliğine özgü karmaşık mikro animasyonlarda ve grafik geçişlerinde Flutter (Impeller) son derece kararlıdır. Standart işletim sistemi geçişlerinde ve liste kaydırmalarında ise React Native (Fabric) doğrudan işletim sisteminin yerel bileşenlerini kullandığı için kullanıcıya %100 doğal platform hissi verir.
- Uygulama Boyutu (App Bundle Size): Native bir "Merhaba Dünya" uygulaması yalnızca birkaç megabayt yer kaplarken, Flutter ve React Native uygulamaları kendi çalışma zamanı motorlarını (Runtime Engine) paketin içine dahil ettikleri için minimum kurulum boyutları 12 MB ila 25 MB bandından başlar.
- Cihaz İçi Yapay Zeka (On-Device AI) Entegrasyonu: Yapay zeka destekli telefonlar üzerinde NPU (Neural Engine) kullanarak yerel büyük dil modelleri (LLM), CoreML veya TensorFlow Lite çalıştırmak gerektiğinde, Native geliştirme veya C++ FFI (Foreign Function Interface) köprüleri kritik rol oynar. Flutter’ın
dart:ffive React Native’in C++TurboModulesdesteği sayesinde her iki çerçeve de yerel C/C++ yapay zeka kütüphanelerini neredeyse sıfır gecikmeyle çağırabilmektedir.
4. Geliştirici Ekosistemi, İşe Alım ve Havuz Büyüklüğü
Bir teknolojiyi seçerken yalnızca teknik benchmark skorlarına değil, o teknolojide uzman yazılımcı bulabilme kolaylığına ve kütüphane ekosistemine de bakmak gerekir:
React Native Avantajı: JavaScript/TypeScript ve Web Sinerjisi
- Dünyadaki en büyük yazılımcı topluluğu JavaScript, TypeScript ve React.js bilmektedir. Web ekibinizde Next.js veya React kullanan geliştiriciler, çok kısa bir adaptasyon süreciyle React Native projelerine katkı sağlayabilir ve iş mantığı kodlarını Web ile Mobil arasında (%70’e varan oranda) paylaşabilir.
- Over-the-Air (OTA) Güncellemeler (CodePush / EAS Update): React Native’in en büyük ticari kozlarından biri, JavaScript paketini (bundle) App Store veya Google Play inceleme sürecini beklemeden anında kullanıcıların telefonuna uzaktan güncelleyebilmesidir (Apple kuralları çerçevesinde uygulamanın ana amacını değiştirmeyen hata düzeltmeleri ve arayüz güncellemeleri için).
Flutter Avantajı: Her Şey Dahil (Batteries-Included) SDK
- React Native’de navigasyon, durum yönetimi, ikonlar ve temel UI bileşenleri için onlarca farklı üçüncü parti
npmpaketine bağımlı kalırken (ve sürüm güncellemelerinde bu paketlerin birbiriyle çakışma riskiyle uğraşırken); Flutter tüm Material Design ve Cupertino (iOS) bileşenlerini, gelişmiş animasyon kütüphanelerini ve test araçlarını Google güvencesiyle tek bir resmi SDK içinde sunar. pub.devekosistemi oldukça olgunlaşmıştır ve Dart dili; Java, C# veya TypeScript bilen bir geliştirici için 1-2 hafta içinde tam hakimiyet kurulabilecek kadar temiz, tip güvenli (type-safe) ve nesne yönelimli bir sözdizimine sahiptir.
Finans ve Mobil Ödeme Uygulamaları İçin Kritik Not: Uygulamanız mobil ödemeler, NFC temassız tahsilat (Tap to Pay), donanım güvenlik modülü (Secure Enclave / StrongBox) veya gelişmiş biyometrik doğrulama içeriyorsa, hem Flutter hem de React Native’de güvenlik açısından kritik modülleri Native katmanda (Platform Channels / TurboModules) yazıp arayüzü çapraz platformda tutmak en güvenli kurumsal mimari yaklaşımdır.
5. Flutter vs. React Native vs. Native Karşılaştırma Tablosu
| Karşılaştırma Kriteri | Flutter (Google) | React Native (Meta) | Native (SwiftUI / Jetpack Compose) |
|---|---|---|---|
| Programlama Dili | Dart (Tip Güvenli, AOT & JIT) | TypeScript / JavaScript | Swift (iOS) & Kotlin (Android) |
| Arayüz Çizim (Rendering) | Impeller Motoru (Özel Canvas, Metal/Vulkan) | Fabric (Gerçek OEM Native Bileşenler) | Doğrudan İşletim Sistemi UI Çerçevesi |
| Performans ve Kare Hızı | Native’e Çok Yakın (Sabit 60/120 FPS) | Yüksek (JSI ve Hermes ile optimize) | Maksimum (Donanım Sınırlarında) |
| Geliştirme Maliyeti ve Süresi | Düşük Maliyet / Çok Hızlı Pazara Çıkış | Düşük Maliyet / Web Ekibiyle Yüksek Sinerji | Yüksek Maliyet (2 Ayrı Ekip ve Kod Tabanı) |
| Platformlar Arası Görsel Uyum | %100 Aynı (Her cihazda piksel kusursuzluğu) | Bulunduğu işletim sisteminin doğal görünümü | Her platformun kendi yerel tasarım dili |
| Anlık Uzaktan Güncelleme (OTA) | Sınırlı (Shorebird ile kod yaması mümkün) | Tam Destek (EAS Update / CodePush) | Yok (Mağaza onayı zorunlu) |
| Üçüncü Parti Paket Bağımlılığı | Düşük (Zengin yerleşik Widget kütüphanesi) | Yüksek (Çok sayıda npm paketine ihtiyaç duyar) | Düşük (Apple ve Google resmi SDK’ları) |
6. Karar Matrisi: Projeniz İçin Hangisini Seçmelisiniz?
Projenizin teknik gereksinimlerine, bütçenize ve ekip yapınıza göre şu karar matrisini uygulayabilirsiniz:
Ne Zaman Flutter Seçmelisiniz?
- Markanıza özgü, hem iOS hem de Android’de milimetrik olarak aynı görünmesi gereken zengin animasyonlu ve özel tasarımlı (Custom UI) bir uygulama geliştiriyorsanız,
- Üçüncü parti paket karmaşasıyla uğraşmadan, Google’ın tek çatı altında sunduğu kararlı, hızlı ve yüksek performanslı bir geliştirme deneyimi arıyorsanız,
- Mobil uygulamanın yanı sıra aynı kod tabanından Masaüstü (Windows, macOS, Linux) veya gömülü ekran (otomotiv/kiosk) çıktısı da almayı planlıyorsanız.
Ne Zaman React Native Seçmelisiniz?
- Şirketinizde halihazırda güçlü bir React.js / TypeScript / Next.js web geliştirici ekibi varsa ve bu bilgi birikimini mobil tarafa taşımak istiyorsanız,
- Uygulamanızın iOS’ta tam bir iPhone uygulaması, Android’de ise tam bir Android uygulaması gibi işletim sisteminin kendi yerel bileşenleriyle (OEM Widgets) çalışmasını önceliklendiriyorsanız,
- E-ticaret kampanyaları ve hızlı A/B testleri için mağaza onayını beklemeden OTA (Over-the-Air) güncellemelerle arayüzü anında yenilemek sizin için kritikse.
Ne Zaman Tam Native (Swift / Kotlin) veya KMP Seçmelisiniz?
- Uygulamanız doğrudan donanım sınırlarını zorluyorsa (4K/8K video kurgu, gelişmiş AR/VR, düşük gecikmeli ses işleme, sürekli arka plan BLE/IoT donanım haberleşmesi veya ağır 3D oyunlar),
- Apple Watch (watchOS), Wear OS, CarPlay, Android Auto ve kilit ekranı canlı etkinlikleri (Live Activities) projenizin merkezinde yer alıyorsa,
- Bütçe kısıtınız yoksa ve her iki platformda da sıfır tavizle en yüksek performansı hedefliyorsanız (veya KMP ile iş mantığını paylaşıp UI’ı Native yazmak istiyorsanız).
7. Durum Yönetimi (State Management), Test Otomasyonu ve CI/CD Süreçleri
Kurumsal ölçekli bir mobil uygulamanın başarısı yalnızca ilk sürümün yayınlanmasıyla değil; yüzlerce ekranlık büyüyen kod tabanının yönetilebilirliği (maintainability), otomatik test edilebilirliği ve CI/CD (Sürekli Entegrasyon / Sürekli Dağıtım) boru hatlarıyla ölçülür. Bu noktada Flutter ve React Native’in mühendislik yaklaşımları önemli farklılıklar gösterir:
Durum Yönetimi (State Management) Mimarileri
- Flutter’da Durum Yönetimi: Büyük ölçekli finans ve e-ticaret projelerinde BLoC (Business Logic Component) ve Riverpod endüstri standardı haline gelmiştir. Özellikle BLoC deseni; olayları (Events) ve durumları (States) kesin sınırlarla ayırarak iş mantığını arayüz kodundan tamamen soyutlar. Bu sayede 20 kişilik bir yazılım ekibi aynı proje üzerinde birbirinin kodunu bozmadan paralel çalışabilir.
- React Native’de Durum Yönetimi: Web dünyasından gelen alışkanlıkla Redux Toolkit (RTK), hafif ve hızlı yapısıyla öne çıkan Zustand ve sunucu durumu önbelleklemesi (Server State Caching) için TanStack Query (React Query) en yaygın kombinasyondur. REST API veya GraphQL kullanan veri yoğunluklu uygulamalarda TanStack Query ile Zustand ikilisi, kod tekrarını minimuma indirir.
Birim, Widget ve Uçtan Uca (E2E) Test Yetenekleri
Flutter, test araçlarını doğrudan çekirdek SDK içinde sunar: Unit Test, gerçek bir cihaza veya emülatöre ihtiyaç duymadan milisaniyeler içinde arayüz davranışlarını doğrulayan Widget Test ve tam kapsamlı Integration Test katmanları kutudan çıktığı haliyle hazırdır. React Native tarafında ise birim testler için Jest ve React Native Testing Library kullanılırken, gerçek cihaz üzerinde uçtan uca (E2E) kullanıcı senaryolarını test etmek için Detox veya son yıllarda her iki platformda da standartlaşan YAML tabanlı Maestro çerçevesi tercih edilmektedir.
Toplam Sahip Olma Maliyeti (TCO) ve Bakım Analizi
Yeni telefon alırken nelere dikkat edilmeli rehberimizde donanım maliyetlerini analiz ettiğimiz gibi, yazılım yatırımlarında da 3 yıllık Toplam Sahip Olma Maliyetini (TCO) hesaplamak gerekir. Ayrı ayrı iOS (Swift) ve Android (Kotlin) ekipleri kurulduğunda; aynı iş kuralının iki kez yazılması, iki kez test edilmesi ve API değişikliklerinin iki ayrı takvimde senkronize edilmesi gerekir. Flutter veya React Native kullanıldığında ise kod paylaşım oranı %85 ila %95 seviyesine çıkar. Bu durum ilk geliştirme bütçesinde %40’a varan tasarruf sağlarken, yeni özelliklerin (Feature Parity) hem iPhone hem de Android kullanıcılarına aynı gün sunulmasını garanti eder.
Sıkça Sorulan Sorular (SSS)
1. Performans açısından Flutter mı yoksa React Native mi daha hızlıdır?
Her iki çerçeve de standart iş, finans, sosyal medya ve e-ticaret uygulamalarında 60 FPS ve 120 FPS hızlarında son kullanıcının fark edemeyeceği kadar akıcı çalışır. Ancak ağır grafik çizimleri, karmaşık özel animasyonlar ve yoğun CPU hesaplamalarında Flutter, Dart dilinin doğrudan ARM makine koduna (AOT) derlenmesi ve Impeller grafik motorunun Metal/Vulkan üzerinde doğrudan çalışması sayesinde küçük ama ölçülebilir bir performans ve kararlılık avantajına sahiptir.
2. Flutter veya React Native ile yazılan uygulamalar App Store veya Google Play’de reddedilir mi?
Hayır, kesinlikle reddedilmez. Hem Apple App Store hem de Google Play Store’da milyonlarca indirmeye sahip binlerce popüler uygulama (örneğin Flutter ile yazılan Google Pay, BMW, Nubank, eBay Motors; React Native ile yazılan Instagram, Facebook, Shopify, Discord, Tesla) sorunsuz şekilde yayınlanmaktadır. Mağazalar uygulamanın hangi çerçeveyle yazıldığına değil, güvenlik, gizlilik ve tasarım yönergelerine uyup uymadığına bakar.
3. Flutter’daki Impeller motoru ne işe yarar ve neden önemlidir?
Impeller, Flutter’ın eski Skia grafik motorunun yerini alan yeni nesil 2D/3D çizim motorudur. En önemli görevi, önceki sürümlerde animasyonların ilk açılışında yaşanan "Shader Compilation Jank" (gölgelendirici derleme takılması) sorununu tamamen ortadan kaldırmaktır. Gölgelendiricileri derleme zamanında (ahead-of-time) hazırlayarak Apple Metal ve Android Vulkan API’leri üzerinden pürüzsüz ve öngörülebilir bir kare hızı sunar.
4. React Native’in "Yeni Mimarisi" (New Architecture) neleri değiştirdi?
React Native’in Yeni Mimarisi; eski asenkron JSON köprüsünü (Bridge) tamamen kaldırarak yerine C++ tabanlı JSI (JavaScript Interface), Fabric render motoru ve TurboModules yapısını getirdi. Bu sayede JavaScript kodu ile Native kod birbirini bellekte senkron olarak doğrudan çağırabilir hale geldi; uygulama açılış süreleri kısaldı ve liste kaydırmalarındaki gecikmeler ortadan kalktı.
5. 2026 yılında sıfırdan mobil uygulama geliştirmeye başlayacak bir yazılımcı hangisini öğrenmeli?
Eğer halihazırda HTML, CSS, JavaScript, TypeScript ve React.js geçmişiniz varsa React Native öğrenmek kariyeriniz için en hızlı ve doğal geçişi sağlar; hem web hem mobil iş ilanlarına başvurabilirsiniz. Ancak sıfırdan başlıyorsanız veya tamamen mobil uygulama uzmanlığına odaklanmak, derli toplu bir SDK ile hızlıca görsel açıdan etkileyici ürünler çıkarmak istiyorsanız Flutter (Dart) öğrenme eğrisi ve geliştirici memnuniyeti açısından mükemmel bir tercihtir.
Yozel
Codex haberleri en az iki bağımsız kaynakla doğrulanır; düzeltmeler yazının altında tarih ve saatle belirtilir. Yayın ilkelerimiz