2026'da React Native 0.85: Yeni Animasyon Backend'i, Katı TypeScript API ve Mülakat Soruları

React Native 0.85, Nisan 2026'da yayınlandı ve framework'ün başlangıcından bu yana en önemli animasyon sistemi revizyonunu sunuyor. 58 katkıda bulunandan 604 commit ile bu sürüm, Shared Animation Backend'i tanıtıyor, post-bridge geçişini tamamlıyor ve kurumsal ortamlar için Metro TLS desteği ekliyor.

Shared Animation Backend: Animated ve Reanimated'ın Birleşimi

React Native 0.85'in ana özelliği, Software Mansion ile iş birliği içinde geliştirilen Shared Animation Backend'dir. Daha önce, yerleşik Animated kütüphanesi ve topluluk tarafından geliştirilen Reanimated kütüphanesi ayrı reconciliation döngüleri sürdürüyordu. Her biri animasyon güncellemelerini uygulamak için kendi iç mantığını çalıştırıyor ve bir sistemdeki performans iyileştirmelerinin diğerine fayda sağlayamadığı izole bir ekosistem oluşturuyordu.

Shared Animation Backend, temel animasyon güncelleme mantığını doğrudan React Native renderer'a taşıyor. Animasyon tabanlı commit'lerin React ve stillendirme kütüphaneleriyle birlikte Shadow Tree için mücadele etmesi yerine, özel bir mekanizma bunları ayrı ayrı yönetiyor.

import { Animated, Pressable, View, StyleSheet } from 'react-native';
import { useRef, useState } from 'react';

function ExpandableCard() {
  const widthAnim = useRef(new Animated.Value(120)).current;
  const heightAnim = useRef(new Animated.Value(80)).current;
  const [expanded, setExpanded] = useState(false);

  const toggle = () => {
    const toWidth = expanded ? 120 : 300;
    const toHeight = expanded ? 80 : 200;

    // Layout props with useNativeDriver — new in 0.85
    Animated.parallel([
      Animated.spring(widthAnim, {
        toValue: toWidth,
        useNativeDriver: true, // Now supports layout props
      }),
      Animated.spring(heightAnim, {
        toValue: toHeight,
        useNativeDriver: true,
      }),
    ]).start();

    setExpanded(!expanded);
  };

  return (
    <Pressable onPress={toggle}>
      <Animated.View
        style={[
          styles.card,
          { width: widthAnim, height: heightAnim },
        ]}
      />
    </Pressable>
  );
}

const styles = StyleSheet.create({
  card: {
    backgroundColor: '#61DAFB',
    borderRadius: 8,
  },
});

0.85 öncesinde, width veya height gibi layout özelliklerinde useNativeDriver: true ayarlamak hata fırlatıyordu. Geliştiriciler, akıcı 60fps animasyonlar (native driver, transform ve opacity ile sınırlı) ile layout değişiklikleri için takılmalı JS-thread animasyonları arasında seçim yapmak zorundaydı. Shared Animation Backend bu beş yıllık sınırlamayı çözüyor.

Animasyon Backend'i Dahili Olarak Nasıl Çalışır

Daha önce -DRN_USE_ANIMATION_BACKEND derleyici bayrağının arkasında saklanan C++ Animation Backend, 0.85'te varsayılan olarak etkin geliyor. Sistem iki özel güncelleme yolu kullanıyor:

• synchronouslyUpdateProps — layout dışı değişiklikler (opacity, transform) için tam Fabric commit döngüsünü atlayan hızlı yol
• Tam Fabric commit — yalnızca layout yeniden hesaplaması gerektiğinde tetikleniyor (width, height, flex, padding)

Bu çift yollu yaklaşım, basit opacity geçişlerinin eskisi kadar hızlı kalmasını sağlarken, layout animasyonlarının native thread performansını regresyon olmadan kazanmasını mümkün kılıyor.

Post-Bridge Mimari: Bridge Artık Yok

React Native 0.85, sıfır bridge geri dönüşü ve eski interop katmanı olmayan ilk kararlı sürüm. JSI (JavaScript Interface) tabanlı yeni mimari, JavaScript ile native kod arasında 2ms altı interop gecikmesiyle doğrudan, senkron iletişim sağlıyor.

Mülakat hazırlığı için pratik etkileri:

// TurboModules now lazy-load by default in 0.85
// Cold-start memory reduced by ~40%
import { TurboModuleRegistry } from 'react-native';

// Module loads only when first accessed, not at app startup
const CameraModule = TurboModuleRegistry.getEnforcing('Camera');

// Direct synchronous call via JSI — no bridge serialization
const hasPermission = CameraModule.checkPermission();

TurboModules, 0.85'te varsayılan olarak tembel yükleniyor ve soğuk başlatma belleğini yaklaşık %40 azaltıyor. Bu, her native modülün hevesle kaydedilmesinin başlangıç cezasını ortadan kaldırıyor — React Native performans optimizasyonu hakkında yaygın bir mülakat sorusu.

Metro TLS: Geliştirme Sunucuları İçin HTTPS

Kurumsal proxy'lerin arkasında çalışan veya yalnızca güvenli bağlantı gerektiren API'leri test eden ekipler, daha önce Metro'nun yalnızca HTTP destekleyen geliştirme sunucusu için geçici çözümlere ihtiyaç duyuyordu. Metro artık TLS'yi yerel olarak destekliyor:

const fs = require('fs');
const { getDefaultConfig } = require('@react-native/metro-config');

const config = getDefaultConfig(__dirname);

// Enable HTTPS + WSS (Fast Refresh over secure WebSocket)
config.server.tls = {
  ca: fs.readFileSync('./certs/ca.pem'),
  cert: fs.readFileSync('./certs/cert.pem'),
  key: fs.readFileSync('./certs/key.pem'),
};

module.exports = config;

Yerel geliştirme için mkcert manuel CA kurulumu olmadan güvenilir sertifikalar oluşturuyor. TLS etkinleştirildiğinde Fast Refresh WSS üzerinden çalışarak güvenli ortamlarda hot-reload'u işlevsel tutuyor.

Kırıcı Değişiklikler ve Geçiş Rehberi

Yükseltme sırasında dikkat gerektiren birkaç kırıcı değişiklik bulunuyor:

Jest Preset çıkarılması — yerleşik preset @react-native/jest-preset'e taşındı:

module.exports = {
  preset: 'react-native',
};

// jest.config.js — after
module.exports = {
  preset: '@react-native/jest-preset',
};

StyleSheet.absoluteFillObject kaldırıldı — StyleSheet.absoluteFill ile değiştirilmeli:

const overlay = StyleSheet.absoluteFillObject;

// After (0.85+)
const overlay = StyleSheet.absoluteFill;

Node.js sürüm gereksinimleri — minimum Node.js 20.19.4. Sürüm 21 ve 23 (her ikisi EOL) desteklenmiyor.

Metin taşma davranışı — borderRadius sınırlarının dışındaki metin artık varsayılan olarak gizleniyor. Yuvarlak köşelerin ötesine uzanan metin için overflow: visible'a dayanan bileşenler, açık overflow: 'visible' stiline ihtiyaç duyuyor.

DevTools: Birden Fazla Eşzamanlı Hata Ayıklayıcı Bağlantısı

React Native 0.85, birden fazla eşzamanlı Chrome DevTools Protocol (CDP) bağlantısını destekliyor. VS Code, React Native DevTools ve yapay zeka destekli kodlama araçları, birbirlerinin oturumlarını sonlandırmadan aynı anda bağlanabiliyor.

Bu, birden fazla araç birleştiren hata ayıklama iş akışları kullanan ekipler için özellikle önemli. Android'deki Network Panel, önceki sürümlerdeki bir regresyon sonrasında istek gövdesi önizlemelerini geri yüklüyor.

Shadow Tree Commit Dallanması

Yeni bir Fabric commit dallanma mekanizması, React Native'in Shadow Tree'ye güncelleme uygulama şeklini temelden değiştiriyor. Daha önce, animasyon commit'leri ve React durum güncellemeleri aynı commit yolu için rekabet ederek yeniden render tetikleyen karmaşık animasyonlar sırasında kare düşüşlerine neden oluyordu.

Dallanma mekanizması bu endişeleri ayırıyor — Animation Backend kendi dalında çalışırken React commit'leri bağımsız olarak ilerliyor. İki dal her karenin sonunda uzlaşarak, daha önce animasyonlu başlıklarla liste kaydırma sırasında görsel aksaklıklara neden olan serpişme sorunlarını önlüyor.

View Transition API (Altyapı)

Yeni bir viewTransitionEnabled özellik bayrağı, görünümler arasında animasyonlu geçişleri mümkün kılan yaklaşan View Transition API'yi kontrol ediyor. Bayrak, 0.85'te varsayılan olarak false — bu gelecek bir sürüm için altyapı, henüz kullanıcıya yönelik bir özellik değil. React Native'in Web View Transitions API'ye benzer yerleşik navigasyon geçişlerine doğru yönünü işaret ediyor.

Mülakat Soruları: React Native 0.85 Mimarisi

React Native mülakatlarına hazırlananlar için 0.85 mimarisini yansıtan temel sorular:

S: Shared Animation Backend hangi sorunu çözüyor?

Shared Animation Backend, daha önce ayrı olan iki animasyon reconciliation sistemini (Animated ve Reanimated) React Native çekirdeğinde tek bir motora birleştiriyor. 0.85 öncesinde, bir sistemdeki performans optimizasyonları diğerine fayda sağlayamıyordu. Paylaşımlı backend ayrıca native driver ile layout özelliklerinin animasyonunu engelleyen sınırlamayı kaldırıyor.

S: TurboModules neden 0.85'te varsayılan olarak tembel yükleniyor?

Başlangıçta tüm TurboModules'un hevesle kaydedilmesi, uygulamanın bir oturum boyunca hiç kullanmayabileceği modüller için bellek tüketiyordu. Tembel yükleme, somutlaştırmayı ilk erişime erteler ve geliştirici tarafındaki API'yi değiştirmeden soğuk başlatma belleğini yaklaşık %40 azaltıyor.

S: Animation Backend'deki iki güncelleme yolunu açıklayın.

synchronouslyUpdateProps, layout dışı özellik değişikliklerini (opacity, transform) Fabric commit'leri tetiklemeden yönetir. Bir animasyon layout özelliklerini (width, height, padding) değiştirdiğinde, doğru layout yeniden hesaplaması için tam bir Fabric commit tetikler. Bu çift yollu yaklaşım, basit animasyonlar için performansı korurken native thread'de layout animasyonunu mümkün kılıyor.

S: Shadow Tree commit dallanması nedir?

Commit dallanması, animasyon kaynaklı Shadow Tree güncellemelerini React durum kaynaklı güncellemelerden bağımsız dallara ayırır. Her dal bağımsız olarak commit yapar ve kare sınırlarında uzlaşır. Bu, React yeniden renderlarının aynı commit yolu için rekabet etmesinden kaynaklanan animasyon takılmalarını önler — animasyonlu öğelerle liste kaydırma sırasında düşen karelerin yaygın bir kaynağı.

Katı TypeScript API: Zorlamaya Doğru

React Native 0.80'de opsiyonel olarak tanıtılan Katı TypeScript API, varsayılan olma yolunda ilerliyor. Etkinleştirmek için:

{
  "compilerOptions": {
    "customConditions": ["react-native-strict-api"]
  }
}

Katı API, türleri manuel olarak sürdürmek yerine doğrudan kaynak kodundan üretiyor. Dışa aktarmaları genel react-native index dosyasıyla sınırlandırarak, sürümler arasında kırılan dahili dosya yollarına bağımlılığı önlüyor. 0.85'e yükseltme yapan ekipler, gelecekteki bir sürümde zorunlu uygulamaya hazırlanmak için bu bayrağı etkinleştirmeli.

Sonuç

• Shared Animation Backend, Animated ve Reanimated'ı tek bir motorda birleştirerek ilk kez useNativeDriver: true ile layout özelliği animasyonunu mümkün kılıyor
• React Native 0.85, sıfır eski interop ile post-bridge geçişini tamamlıyor ve tembel yüklenen TurboModules sayesinde soğuk başlatma belleğini %40 azaltıyor
• Metro TLS desteği, kurumsal geliştirme ortamları için HTTPS gereksinimlerini çözüyor
• Shadow Tree commit dallanması, rekabet eden React commit'lerinin neden olduğu animasyon takılmalarını ortadan kaldırıyor
• Katı TypeScript API, zorunlu uygulamaya hazırlanmak için şimdi etkinleştirilmeli
• Ekipler, yükseltmeden önce kırıcı değişiklikleri (Jest preset çıkarılması, StyleSheet.absoluteFillObject kaldırılması, Node.js 20+ gereksinimi) ele almalı