Flutter 3.35: Performans, Erişilebilirlik ve UI’da Dikkat Çeken Atılımlar

 

Yeni başlayanlardan profesyonel geliştiricilere kadar herkesin bilmesi gereken noktaları

Her gün derinleşen Flutter ekosisteminde, bazen gözümüze ufak bir değişiklik göze çarpar ama altında büyük bir dönüşüm gizlidir. Flutter 3.35, işte böyle “küçük ama etkili” güncellemelerle geldi. Bu yazıda, en dikkat çeken yenilikleri keşfederken, her biriyle alakalı neden önemli olduklarını ve pratikte nasıl göze çarptıklarını anlatıyorum. Umarım faydalı olur.

Yazının tamamına buradan ulaşabilirsiniz.

Breaking Changes — Kodunuzu Yeniden Yazmanız Gereken Değişiklikler

Form artık sliver değil

Daha önce CustomScrollView içindeki Form widget’ı doğrudan kullanabiliyorduk, artık bir hata alıyoruz. Yeni dünyada şu şekilde:

CustomScrollView(
  slivers: [
    SliverToBoxAdapter(
      child: Form(...),
    ),
  ],
);

Kodunuzda Form widget’ının yapı olarak nerede yer aldığına dikkat etmeniz gerekecek — çünkü bu doğrudan dönüşümsüz bir değişiklik.

Semantics elevation & thickness kaldırıldı

Erişilebilirlik API’lerinde yer alan semanticsElevation ve semanticsThicknessözellikleri artık yok. Eğer özel a11y donanımlı widget’lar geliştirdiyseniz, bu alanları yeniden gözden geçirmeniz gerekebilir.

DropdownButtonFormField’de value deprecated, initialValue geldi

Artık DropdownButtonFormField kullanırken:

DropdownButtonFormField<String>(
  initialValue: 'A',
  items: [...],
  onChanged: (v) {},
);

value: alanını kullanıyorsanız, bunu initialValue: ile değiştirmeniz gerekiyor. Bu, form state yönetimini daha tutarlı hale getirmek için yapılmış. Kodlarıızı bu doğrultuda ayarlamalısınız.

Radio Widget Yeniden Tasarlandı

Radio artık görsel ve davranışsal olarak güncellendi. Tema uyumu ve erişilebilirlik açısından iyileştirildi. Ancak özelleştirme yapıyorsanız yeni RadioThemeData alanlarına bakmanız gerekecek. Buna noktada tema ile ilgili ayrı bir parantez açsam iyi olacak.

Tema Normalizasyonu

Birçok component theme API’sinde (AppBarTheme, InputDecorationTheme vb.) isimlendirme ve varsayılan değerler düzenlendi. Tema dosyalarınızda uyarılar alabilirsiniz.

Framework Tarafındaki Önemli Geliştirmeler

Widget Preview’ın ışık-dil desteği

Widget Preview özelliği çok daha esnek hale geldi: tema ve parlaklık (brightness) ayarlarını ve dil yerelleştirmesini artık farklı modalitelerde test edebilirsiniz. Özellikle paket geliştiriciler için faydalı olacağını düşünüyorum.

DrivenScrollActivity.simulation Constructor

Daha karmaşık scroll animasyonlarını manuel olarak yönetmek isteyenler için yeni bir constructor eklendi. Bunun, özel fizik animasyon senaryolarında işinize yarayacağı belirtilmiş. Örneğin:

TreeSliver & SliverEnsureSemantics

Flutter içindeki TreeSliver yapısının kaydırma (scroll) davranışı düzeltildi, artık daha az UI artifaktı yaşanıyor. Aynı zamanda erişilebilirlik açısından da SliverEnsureSemantics hatalı alt-özellikler yeniden canlandırıldı — özellikle ekran okuyucu kullanıcıları için olumlu.

MediaQuery.heightOf / widthOf

MediaQuery.sizeOf(context).height yerine artık direkt MediaQuery.heightOf(context) gibi daha kısa metodlar var.

final screenHeight = MediaQuery.heightOf(context);

Cupertino ve Material Değişiklikleri

Cupertino

• CupertinoSlider artık titreşim (haptic feedback) destekli. Dokunsal geri bildirim kullanıcının kaydırdığı hissini pekiştiriyor.
• CupertinoDatePicker, CupertinoTimerPicker, CupertinoExpansionTile, CupertinoCollapsible gibi yeni bileşen veya gelişmiş davranışlar geldi.
• Düğmeler, navigasyon bar geçişleri daha tutarlı, animasyonlar daha pürüzsüz hale geldi.

Material

CarouselView Geliştirmeleri

CarouselView artık temalandırılabilir ve hatalar giderildi. Mouse scroll desteği ve crash fix’leri önemli.

InputDecorationTheme Genişletildi

• visualDensity desteği geldi.
• hintMaxLines eklenerek uzun placeholder metinlerinin kontrolü kolaylaştı.
• hintLocales ile placeholder için çoklu dil desteği mümkün oldu.

Switch ve CheckboxListTile Geliştirmeleri

• Switch için activeThumbColor eklendi.
• CheckboxListTile ve SwitchListTile için isThreeLine tema üzerinden ayarlanabilir.

DropdownMenuFormField Yenilikleri

• restorationId desteği.
• trailingIcon gizlenebilir.
• value parametresi yerine initialValue. (yukarıda bunu açıklamıştım)

Platforma Özel İyileştirmeler

iOS & macOS

• Minimum iOS sürümü 13’ten 14’e şeklinde güncellenmedi ama bazı API’lerde modern Swift uyumu sağlandı.
• Swift ile embedder desteği genişledi.
• Hot restart ardından klavye kapanması gibi küçük ama önemli iyileştirmeler yapıldı.
• Live Text destekleri eklendi.

Android

• Min SDK yükseltildi: artık API 24 (Lollipop) altı desteklenmiyor.
• Android target SDK hedefi 36’ye çıktı.
• Impeller Vulkan başlatma süresi iyileşti, grafik odaklı uygulamalar bunu doğrudan hissedecek.
• Deprecation: setStatusBarColor vb. metotlar kaldırılacak.

Web

• Safari/Firefox’taki bazı input focus sorunları giderildi.
• VoiceOver gibi erişilebilirlik araçlarında tab sıralaması düzenlendi.
• Paint dithering sayesinde grafiksel pürüzsüzlük arttı.

Windows

• Multi-window desteği eklendi.
• Platform ve UI thread’leri “birleşik yapı”ya kavuşturuldu. Windows uygulamalarında performans ve sabitlik artışı hedefleniyor.

Engine ve Performans İyileştirmeleri

• Impeller: kesme (stroke) hesaplamaları daha verimli, Vulkan modunda daha hızlı açılış.
• Leak tracker’ın web için deneysel modu geldi, developer memory leak kontrolü kolaylaşıyor.
• Pub workspace ile çalışma altyapısı Modern Flutter projesine evrildi.
• Test süreçlerinde birçok pub package temizlendi, build süreci hızlandı.
• Frame rendering daha kararlı: Özellikle düşük donanımlı cihazlarda FPS dalgalanmaları %30 oranında azaldı.
• Shader compilation cache geliştirmeleri sayesinde ilk açılışta yaşanan “jank” sorunu büyük ölçüde azaldı.
• Skia güncellemesi ile daha keskin vektör çizimleri ve düşük bellek tüketimi.

Küçük bir not: Eğer oyun benzeri animasyonlar kullanıyorsanız, bu sürümde Impeller ile test yapmayı deneyin. Daha akıcı bir deneyim fark edeceğinizi söylüyorlar.

Özetle;

Flutter 3.25, sadece bir sürüm güncellemesi değil; daha akıcı, daha uyumlu ve geliştirici dostu bir deneyim sunuyor. Ayrıca performans optimizasyonuaçısından da önemli bir adım.

Küçük projeler için bile faydalı olan, büyük projelerde ise doğrudan kodunuzu etkileyecek değişiklikler içeriyor. Elimden geldiğince release notlarından özetlemeye çalıştım umarım faydalı olur.

Eğer projenizde henüz güncelleme yapmadıysanız, Flutter’ı şu komutla hemen güncelleyebilirsiniz:

flutter upgrade

Buraya kadar okuduğunuz için teşekkür ederim.

Yazımı beğendiyseniz clap butonuna tıklamayı ve diğer içeriklerimden haberdar olmak için abone olmayı unutmayın.

Yeni yazılarda görüşmek üzere.

Selin.

Flutter State Management’ta En Sık Yapılan 10 Hata ve Çözüm Yolları

 

Herkese merhaba. Bugün sizlere çoğumuz için karmaşık gelen StateManagement konusu ile geldim. Hemen başlayalım.

Flutter projeniz ilk başta minik bir “merhaba dünya” uygulaması gibi masum görünebilir. Ama işler büyüyüp ekranlar, API çağrıları, kullanıcı etkileşimleri ve veri yönetimi devreye girdiğinde, state management konusu bir anda korku filmine dönüşebilir.

Yanlış state yönetimi:

1. Uygulamanızı yavaşlatır.
2. Kodun okunabilirliğini bitirir.
3. Takım içi çalışmayı zorlaştırır.
4. Ve en kötüsü, gelecekte hata ayıklamayı imkânsız hale getirir.

Bu yazıda, Flutter’da state yönetimi yaparken en sık karşılaşılan 10 hatayıgerçek kod örnekleri ve çözüm yollarıyla inceleyeceğiz.

Ayrıca, bu hataları nasıl önceden fark edebileceğinizi ve daha performanslı, sürdürülebilir kod yazabileceğinizi konuşacağız.

1. Tüm State’i Tek Yere Toplamak

Hata: Tek bir Provider, Bloc veya State sınıfı içine tüm uygulamanın state’ini koymak.

class AppState with ChangeNotifier {
  String userName = '';
  int cartItemCount = 0;
  bool isDarkMode = false;
  List<String> notifications = [];

  void updateUserName(String name) {
    userName = name;
    notifyListeners();
  }

  void addNotification(String message) {
    notifications.add(message);
    notifyListeners();
  }
}

Bu yapı küçük projede masum görünür. Ancak proje büyüdükçe:

• Gereksiz rebuild’ler olur (tek alan değişse bile tüm dinleyiciler tetiklenir).
• Kod karmaşıklaşır.
• Test etmek zorlaşır.

Çözüm:
Modüler state yönetimi → Her feature için ayrı state sınıfları veya Bloc’lar.

class UserState with ChangeNotifier {
  String userName = '';
  void updateUserName(String name) {
    userName = name;
    notifyListeners();
  }
}

class CartState with ChangeNotifier {
  int itemCount = 0;
  void addItem() {
    itemCount++;
    notifyListeners();
  }
}

2. Gereksiz Rebuild’ler

Hata: Consumer veya BlocBuilder ile tüm ekranı sarmak.

Consumer<CartState>(
  builder: (context, cart, child) {
    return Scaffold(
      appBar: AppBar(title: Text('Cart (${cart.itemCount})')),
      body: ProductList(),
    );
  },
);

itemCount değiştiğinde tüm ekran yeniden çizilir.

Çözüm:
Sadece gerekli kısmı rebuild etmek için Selector veya küçük widget’lar kullanın.

AppBar(
  title: Selector<CartState, int>(
    selector: (context, cart) => cart.itemCount,
    builder: (context, count, child) => Text('Cart ($count)'),
  ),
)

3. Local ve Global State’i Karıştırmak

Hata: UI’ye özgü verileri global state’te tutmak.

Örnek: Modal açık/kapalı durumu globalde tutuluyor.

class AppState with ChangeNotifier {
  bool isModalOpen = false;
}

Çözüm:
Ekrana özel state’leri StatefulWidget içinde veya local provider’da tutun.

class MyScreen extends StatefulWidget {
  @override
  State<MyScreen> createState() => _MyScreenState();
}

class _MyScreenState extends State<MyScreen> {
  bool isModalOpen = false;
}

4. Business Logic ile UI’nin Karışması

Hata: API çağrıları veya veri işleme kodunun doğrudan widget içinde olması.

ElevatedButton(
  onPressed: () async {
    final data = await fetchData();
    setState(() {
      result = data;
    });
  },
  child: Text("Load"),
)

Çözüm:
İş mantığını state management katmanına taşıyın.

class DataState with ChangeNotifier {
  String result = '';
  Future<void> loadData() async {
    result = await fetchData();
    notifyListeners();
  }
}

5. Immutable Olmayan State Kullanımı

Hata: State objesini doğrudan değiştirmek.

state.user.name = 'John'; // False

Çözüm:
State’i immutable tutmak, copyWith kullanmak.

class User {
  final String name;
  User({required this.name});

  User copyWith({String? name}) {
    return User(name: name ?? this.name);
  }
}

6. dispose() ve Memory Management İhmali

Hata: Stream, Controller veya Timer’ları dispose etmemek.

class MyNotifier with ChangeNotifier {
  final controller = StreamController();
}

Çözüm:
dispose() metodunu eklemek.

@override
void dispose() {
  controller.close();
  super.dispose();
}

7. Provider’da notifyListeners()’ın Fazla Kullanımı

Hata: Tek bir değişiklik için tüm dinleyicileri tetiklemek.

void updateCart() {
  itemCount++;
  notifyListeners();
}

Çözüm:
Veriyi parçalara ayırmak veya context.select() ile hedef rebuild yapmak.

8. Bloc’ta Tek Event ile Her Şeyi Yönetmek

Hata: Tüm işlemleri tek event’te toplamak.

class AppEvent {}

Çözüm:
Her işlem için ayrı event tanımlayın.

class LoadUser extends AppEvent {}
class UpdateCart extends AppEvent {}

9. GetX’te Gereksiz Reactive Variable Tanımlamak

Hata: Değişmeyecek verileri bile .obs yapmak.

final appName = 'MyApp'.obs; // Not useful

Çözüm:
Sadece değişen ve UI’yi etkileyen değerleri reactive yapın.

10. Yanlış Kütüphane Seçimi

Hata: Proje ihtiyacını analiz etmeden popüler olduğu için kütüphane seçmek.

Çözüm:

• Küçük projeler → Provider / Riverpod
• Orta projeler → Riverpod / Bloc
• Büyük ekip projeleri → Bloc / Clean Architecture

Sonuç ve Öneriler

1. State yönetimini proje başında doğru planlayın.
2. Modüler yaklaşım kullanın.
3. Gereksiz rebuild’leri azaltın.
4. Immutable veri yapıları tercih edin.
5. Test edilebilirliği göz ardı etmeyin.

Kaynaklar

• Flutter Docs: State Management
• Reso Coder — Bloc & Clean Architecture
• Flutter Explained — State Management Tutorials

Buraya kadar okuduğun için teşekkür ederim.

Bu yazıyı beğendiysen alkış butonuna tıklamayı unutma. Diğer içeriklerimden haberdar olmak için abone olabilirsin.

Teşekkür ederim.

Selin.