Optimizar la obtención de flows y paywalls en el SDK de Capacitor

Una obtención fiable de flows o paywalls en Capacitor hace tres cosas: renderiza rápido, devuelve la variación según la audiencia y recurre al respaldo sin problemas cuando la red es lenta. Las siguientes reglas cubren la temporización, el caché y los patrones de respaldo para conseguirlo.

Tip

Las reglas asumen que adapty.activate() y adapty.identify() ya se han resuelto. Consulta Orden de llamadas en el SDK de Capacitor.

Reglas y errores comunes

Haz esto	No hagas esto	Por qué
Obtén el placement que estás a punto de mostrar.	Precarga todos los placements de forma simultánea al iniciar.	La precarga masiva bloquea el hilo principal y provoca una pantalla en negro durante el pico.
Obtén `getFlow` después de que la atribución haya tenido oportunidad de resolverse — por ejemplo, 1–2 segundos después de `activate` o cuando se active el listener `onLatestProfileLoad`.	Llames a `getFlow` al inicio de la app en `App.tsx`.	La atribución aún no ha llegado. El flow se resuelve con la audiencia predeterminada y omite silenciosamente los segmentos y la personalización de ASA.
Establece un `loadTimeoutMs` y configura un paywall de respaldo para cada placement.	Esperes indefinidamente en `getFlow`.	Sin un tiempo de espera, los usuarios con mala conexión ven una pantalla en blanco hasta que la red responda — o cierran la app.

Consulta Obtener paywalls y productos para la referencia de los parámetros fetchPolicy y loadTimeoutMs, y Placements para elegir el placement adecuado.

Mostrar el contenido multimedia de la primera pantalla desde el bundle de la app

Un flow descarga sus imágenes y vídeos desde Adapty. Para mostrar al instante el contenido multimedia de la primera pantalla, sírvelo directamente desde el bundle de la app. Es una buena forma de reutilizar recursos que ya tienes incluidos, como los visuales de un onboarding nativo existente.

En el Flow & Paywall Builder, establece un ID de multimedia personalizado en la imagen o el vídeo. El archivo que subas allí se usará como respaldo.
Añade el archivo a los proyectos nativos: el bundle de la app iOS y la carpeta assets de Android.
Cuando crees la vista del flow, pasa el archivo empaquetado para ese ID en customAssets:


// "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 });

Los archivos incluidos en el bundle aumentan el tamaño de descarga de tu app, así que incluye solo los archivos multimedia que el usuario ve primero.

Los archivos multimedia que no incluyas en el bundle aparecen igualmente de forma inmediata: el layout del flow incluye una copia en baja resolución de cada imagen, incluido el fotograma estático de un vídeo, y la muestra hasta que se carga el archivo completo.

Para la referencia completa de customAssets, consulta Personalizar assets.

Ajusta para conectividad deficiente

Para mercados con conectividad habitualmente deficiente (zonas rurales, transporte, regiones con problemas de enrutamiento):

Establece fetchPolicy: 'return_cache_data_else_load' en cada petición excepto la primera.
Configura un paywall de respaldo para cada placement en el Adapty Dashboard.
Establece loadTimeoutMs entre 3000 y 5000 milisegundos y acepta el respaldo cuando se agote el tiempo.
No condicionales la visualización del flow a adapty.getProfile(). Llama a getFlow de forma independiente para que un perfil lento no bloquee la interfaz.