Arkadaşlar selam, uzun süredir React Native ile uğraşıyorum ve özellikle animasyon konusunda kafama takılan bazı noktalar var. Projelerimde karşılaştığım performans sorunları yüzünden sürekli arayış içindeyim. Özellikle listelerde kaydırma yaparken veya karmaşık bir geçiş animasyonu kullandığımda cihazlarda takılmalar oluyor. Animated API ile çalışırken native driver kullanımı şart gibi görünüyor ama her durumda native driver desteklemiyor, mesela layout özelliklerini animasyonla değiştirirken sıkıntı yaşıyorum. Siz bu gibi durumlarda ne yapıyorsunuz? useNativeDriver: true kullanmadığım animasyonları minimize mi ediyorsunuz, yoksa tamamen Reanimated gibi kütüphanelere mi geçiyorsunuz?
Bir diğer konu, animasyonlu bileşenleri gereksiz yere yeniden render etmemek için ne gibi önlemler alıyorsunuz? Ben genelde useMemo ve useCallback ile fonksiyonları ve değerleri memoize ediyorum ama yine de bazen animasyon sırasında bileşen ağacının tamamı güncelleniyormuş gibi hissediyorum. Özellikle FlatList içinde animasyonlu kartlar kullanırken, her bir kartın animasyonu diğerlerini etkilemesin diye ayrı componentler oluşturuyorum ama bu sefer de kod kalabalığı artıyor. React.memo ile sarmalamak yeterli mi, yoksa daha ileri seviye bir state yönetimi mi gerekiyor? Tecrübelerinizi merak ediyorum.
Son olarak, animasyon performansı için image caching ve boyutlandırma konusunda takıldığım bir nokta var. Animasyonlu bir galeri yaparken resimler yüklenene kadar boşluklar oluşuyor ve bu da animasyon akışını bozuyor. resizeMode ve önceden yükleme stratejileri dışında, özellikle düşük segment cihazlarda çalışan bir çözüm bulan var mı? Belki de animasyonları JS thread'inden ayırıp UI thread'de çalıştırmak için Reanimated 2'deki worklet'leri kullanmak tek çare? Sizin projelerinizde hangi yaklaşım daha stabil sonuç verdi, tartışalım.
Bir diğer konu, animasyonlu bileşenleri gereksiz yere yeniden render etmemek için ne gibi önlemler alıyorsunuz? Ben genelde useMemo ve useCallback ile fonksiyonları ve değerleri memoize ediyorum ama yine de bazen animasyon sırasında bileşen ağacının tamamı güncelleniyormuş gibi hissediyorum. Özellikle FlatList içinde animasyonlu kartlar kullanırken, her bir kartın animasyonu diğerlerini etkilemesin diye ayrı componentler oluşturuyorum ama bu sefer de kod kalabalığı artıyor. React.memo ile sarmalamak yeterli mi, yoksa daha ileri seviye bir state yönetimi mi gerekiyor? Tecrübelerinizi merak ediyorum.
Son olarak, animasyon performansı için image caching ve boyutlandırma konusunda takıldığım bir nokta var. Animasyonlu bir galeri yaparken resimler yüklenene kadar boşluklar oluşuyor ve bu da animasyon akışını bozuyor. resizeMode ve önceden yükleme stratejileri dışında, özellikle düşük segment cihazlarda çalışan bir çözüm bulan var mı? Belki de animasyonları JS thread'inden ayırıp UI thread'de çalıştırmak için Reanimated 2'deki worklet'leri kullanmak tek çare? Sizin projelerinizde hangi yaklaşım daha stabil sonuç verdi, tartışalım.