React Native SDK'da flow ve paywall getirme işlemini optimize edin

React Native’de güvenilir bir flow veya paywall getirme işlemi üç şeyi yapar: hızlı render eder, kitleye özel varyantı döndürür ve ağ yavaş olduğunda sorunsuz şekilde yedek içeriğe geçer. Aşağıdaki kurallar bu hedeflere ulaşmak için gereken zamanlama, önbellekleme ve yedek desenlerini kapsar.

Tip

Bu kurallar, adapty.activate() ve adapty.identify() işlemlerinin zaten tamamlandığını varsayar. Daha fazla bilgi için bkz. React Native SDK’da çağrı sırası.

Kurallar ve yaygın hatalar

Bunu yapın	Bunu yapmayın	Neden
Göstermek üzere olduğunuz placement’ı çekin.	Başlangıçta tüm placement’ları eş zamanlı olarak önceden çekin.	Toplu önceden çekme, JS thread’ini bloke eder ve bu sırada siyah ekran görünür.
Attribution’ın çözümlenmesi için zaman tanıdıktan sonra `getFlow` çağırın — örneğin `activate` sonrası 1-2 saniye bekleyin ya da `onLatestProfileLoad` tetiklendikten sonra çağırın.	`getFlow`’u root bileşen mount’unda çağırın.	Attribution henüz gelmemiştir. Flow, varsayılan kitleye göre çözümlenir ve segment ile ASA kişiselleştirme sessizce atlanır.
Bir `loadTimeoutMs` belirleyin ve her placement için bir yedek paywall yapılandırın.	`getFlow` için süresiz bekleyin.	Zaman aşımı olmadan, bağlantısı zayıf kullanıcılar ağ çözümlenene kadar boş ekranla karşılaşır ya da uygulamayı kapatır.

Bkz. fetchPolicy ve loadTimeoutMs parametre referansı için Paywall ve ürünleri getirme, doğru placement’ı seçmek için ise Placement’lar.

Uygulama paketinden ilk ekran medyasını göster

Bir flow, görselleri ve videoları Adapty’den indirir. İlk ekranın medyasını anında göstermek için bunları uygulama paketinden sunun. Bu, zaten gönderdiğiniz medyayı (örneğin mevcut bir native onboarding’in görsellerini) yeniden kullanmanın iyi bir yoludur.

Flow & Paywall Builder’da görsel veya videoya özel medya ID’si belirleyin. Oraya yüklediğiniz dosya, yedek olarak kalır.
Dosyayı yerel projelere ekleyin: iOS uygulama bundle’ı ve Android assets klasörü.
Flow görünümünü oluştururken, customAssets içinde söz konusu ID için bundle’lanmış dosyayı geçin:

// "welcome_video", Flow & Paywall Builder'da ayarlanan özel medya kimliğidir
const bundledAssets: Record<string, AdaptyCustomAsset> = {
  'welcome_video': {
    type: 'video',
    fileLocation: {
      ios: { fileName: 'welcome.mp4' },
      android: { relativeAssetPath: 'videos/welcome.mp4' },
    },
  },
};

const view = await createFlowView(flow, { customAssets: bundledAssets });

Paketlenmiş dosyalar uygulamanızın indirme boyutunu artırır; bu nedenle yalnızca kullanıcıların ilk gördüğü medyayı paketleyin.

Paketlemediğiniz medyalar yine de anında görünür: flow’un düzeni, video için sabit kare dahil olmak üzere her görselin küçük, düşük çözünürlüklü bir kopyasını içerir ve tam dosya yüklenene kadar bunu gösterir.

customAssets referansının tamamı için bkz. Varlıkları özelleştirme.

Zayıf bağlantı için ayarlama

Sürekli zayıf bağlantının yaşandığı pazarlar için (kırsal bölgeler, toplu taşıma, yönlendirme sorunlarından etkilenen bölgeler):

İlk fetch dışındaki her fetch işleminde fetchPolicy: 'return_cache_data_else_load' ayarlayın.
Adapty Kontrol Paneli’ndeki her placement için bir yedek paywall yapılandırın.
loadTimeoutMs değerini 3–5 saniye olarak ayarlayın ve zaman aşımı gerçekleştiğinde yedek paywalli kabul edin.
Flow gösterimini getProfile() işlemine bağlamayın. Yavaş bir profilin arayüzü engellemesini önlemek için getFlow işlevini bağımsız olarak çağırın.