Capacitor SDK'da flow ve paywall getirme işlemini optimize etme

Capacitor’da güvenilir bir flow veya paywall getirme işlemi üç şeyi başarır: hızlı render eder, kitleye özel varyantı döndürür ve ağ yavaşken sorunsuz bir şekilde yedek seçeneğe geçer. Aşağıdaki kurallar bunu sağlamak için zamanlama, önbellekleme ve yedek desenlerini kapsar.

Tip

Bu kurallar, adapty.activate() ve adapty.identify() işlemlerinin zaten tamamlandığını varsayar. Bkz. Capacitor SDK’da çağrı sırası.

Kurallar ve tuzaklar

Bunu yapınBunu yapmayınNeden
Göstereceğiniz placement’ı getirin.Tüm placement’ları başlangıçta eş zamanlı olarak önceden getirin.Toplu önceden getirme, ana iş parçacığını bloke eder ve bu süreçte siyah ekran oluşur.
getFlow’u attribution’ın çözümlenme şansı bulduktan sonra getirin — örneğin, activate’ten 1–2 saniye sonra veya onLatestProfileLoad dinleyicisi tetiklendikten sonra.getFlow’u App.tsx içinde uygulama başlangıcında çağırın.Attribution henüz gelmemiştir. Flow, varsayılan kitleye göre çözümlenir ve segment ile ASA kişiselleştirmesini sessizce atlar.
Her placement için bir loadTimeoutMs ayarlayın ve bir yedek paywall yapılandırın.getFlow’u süresiz olarak bekleyin.Zaman aşımı olmadan, bağlantısı zayıf olan kullanıcılar ağ çözümlenene kadar boş bir ekran görür — ya da uygulamayı kapatır.

fetchPolicy ve loadTimeoutMs parametre referansı için Paywall ve ürünleri getirme bölümüne, doğru placement’ı seçmek için ise Placement’lar bölümüne bakın.

İlk ekran medyasını uygulama paketinden gösterme

Bir flow, görsel ve videolarını Adapty’den indirir. İlk ekranın medyasını anında göstermek için bunları uygulama paketinden sunabilirsiniz. Bu yöntem, mevcut native onboarding görselleri gibi uygulamada zaten yer alan medyaları yeniden kullanmanın pratik bir yoludur.

  1. Flow & Paywall Builder’da görsele veya videoya bir özel medya kimliği ayarlayın. Oraya yüklediğiniz dosya yedek olarak kalır.
  2. Dosyayı native projelere ekleyin: iOS uygulama bundle’ı ve Android assets klasörü.
  3. Flow görünümünü oluştururken, customAssets içinde o kimliğe ait paketlenmiş dosyayı aktarın:

// "welcome_video" is the custom media ID set in the Flow & Paywall Builder
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 medya yine de hemen görünür: flow’un düzeni her görselin küçük, düşük çözünürlüklü bir kopyasını (video için sabit kare dahil) içerir ve tam dosya yüklenene kadar bunu gösterir.

customAssets için tam referansa ulaşmak istersen Varlıkları özelleştir bölümüne bakabilirsin.

Zayıf bağlantı için ayarlama

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

  • Her fetch işleminde (ilk hariç) fetchPolicy: 'return_cache_data_else_load' ayarlayın.
  • Adapty kontrol panelinde her placement için bir yedek paywall yapılandırın.
  • loadTimeoutMs değerini 3000–5000 milisaniye olarak ayarlayın ve zaman aşımı gerçekleştiğinde yedek paywalle geçin.
  • Flow gösterimini adapty.getProfile() çağrısına bağlamayın. getFlow fonksiyonunu bağımsız olarak çağırın; böylece yavaş bir profil yüklenmesi arayüzü engellemez.