Replit + pantalla splash
Una pantalla blanca durante dos segundos al abrir la app es la manera en que una app de Replit se gana una observación por la directriz 2.1 o una reseña de una estrella. La app nativa se abre al instante; tu app web necesita un momento. WebViewGold cubre ese momento con una splash con tu marca, un indicador de carga nativo y deslizar para actualizar (pull-to-refresh), y unas pocas líneas en tu app web hacen que la transición sea invisible.
Desde $109 de pago único por plataforma, o deja que nuestro equipo lo haga todo desde $698.
La app arranca en milisegundos, pero el primer HTML, CSS y JavaScript todavía tienen que llegar por la red. Con un servidor en frío (hosting que escala a cero) o una conexión débil, eso tarda segundos. Sin splash, usuarios y revisores se quedan mirando un WebView vacío.
La mayoría de las apps de vibe coding son single-page apps de React. Cuando la página "ha terminado de cargar", el elemento raíz todavía puede estar vacío hasta que JavaScript renderiza y llegan los primeros datos. Si la splash desaparece justo en ese momento, ves un fotograma en blanco.
Una app oscura detrás de un fondo de splash blanco, o un fondo de página blanco bajo una cabecera oscura, provoca un destello en cada arranque. Un único color de fondo compartido por la splash, el HTML y la barra de estado lo elimina.
Pega esto en Replit para implementar la parte de la web app. Revisa el resultado, publica y luego prueba dentro de la app WebViewGold.
Esta app va a funcionar dentro del envoltorio nativo WebViewGold, que muestra una splash hasta que carga la primera página. Haz que los arranques sean rápidos y nunca se queden en blanco: 1. Sirve el cliente compilado desde Express con compresión, Cache-Control: public, max-age=31536000, immutable para los assets con hash y Cache-Control: no-cache para index.html. 2. En el index.html del cliente, define un color de fondo inline en html y body igual al fondo de la app y añade un pequeño esqueleto de carga con CSS dentro del elemento raíz. 3. Mientras se comprueba la sesión de Replit Auth, muestra el esqueleto en lugar de una página vacía. 4. Cuando navigator.userAgent contenga "WebViewGold", envuelve las llamadas a la IA u otros endpoints lentos con spinneron:// antes y spinneroff:// después, y muestra también un texto de progreso en la página. 5. Muestra un error amable con un botón Reintentar cuando una petición falle o agote el tiempo de espera. 6. Dime el color de fondo en hex para la splash nativa.
Mi WebView de iOS finalmente está aprobada. ¡Gracias!
Diez minutos en Config.swift y Config.java, y luego una nueva compilación.
iOS: splashScreenEnabled en Config.swift y tu splash.gif cuadrado (128, 512 o 1024 px) en la raíz del proyecto. Android: SPLASH_SCREEN_ACTIVATED en Config.java y splash.gif en los assets. Los GIF animados funcionan; mantén la animación corta.
Ajusta splashscreencolor en iOS y el fondo de la splash en colors.xml en Android exactamente al color de fondo de tu primera pantalla. Controla el tamaño del logo con scaleSplashImage y SCALE_SPLASH_IMAGE (porcentaje del lado más corto de la pantalla; 0 lo oculta).
Pon remainSplashOption (iOS) y REMAIN_SPLASH_OPTION (Android) en true: la splash se queda hasta que la URL de inicio ha cargado, en lugar de dar paso al indicador de carga tras un splashTimeout / SPLASH_TIMEOUT fijo. Opcional: splashMinTime / SPLASH_MIN_TIME para una duración mínima y splashFadeTime / SPLASH_FADE_OUT para el fundido de salida, en milisegundos.
Después del arranque, WebViewGold muestra su indicador nativo cada vez que se carga una página. En iOS elige entre spinner o barra de progreso (useLoadingSign, useLoadingProgressBar) y un color (loadingIndicatorColor); en Android cámbialo con ACTIVATE_PROGRESS_BAR.
Dale al elemento html un color de fondo inline en index.html igual al color de la splash, y renderiza un esqueleto de carga ligero en lugar de una raíz vacía mientras se comprueba la sesión y se cargan los primeros datos. Así, el paso de la splash a la app web es imperceptible.
El trabajo en el cliente no es una carga de página, así que el indicador nativo no aparece por sí solo. Actívalo y desactívalo tú mismo en tu app de Replit durante generaciones con IA, subidas de archivos o llamadas largas al backend, y desactiva deslizar para actualizar en pantallas con gestos propios:
const inApp = navigator.userAgent.includes("WebViewGold"); // tu token personalizado de user agent
async function withNativeSpinner(task) {
if (inApp) window.location.href = "spinneron://";
try {
return await task();
} finally {
if (inApp) window.location.href = "spinneroff://";
}
}
// uso
// const reply = await withNativeSpinner(() => fetch("/api/generate", { method: "POST", body }));
// mapas, tableros de arrastrar y soltar, carruseles: desactívalo mientras la pantalla esté abierta
function setPullToRefresh(enabled) {
if (inApp) window.location.href = enabled ? "enablepulltorefresh://" : "disablepulltorefresh://";
}pulltorefresh en true y preventoverscroll en false (el gesto necesita el efecto rebote). Colores para los modos claro y oscuro: pulltorefresh_loadingsigncolour_lightmode, pulltorefresh_backgroundcolour_lightmode y las variantes _darkmode (documentación de deslizar para actualizar).ENABLE_PULL_REFRESH en true en Config.java. Las mismas llamadas enablepulltorefresh:// y disablepulltorefresh:// funcionan en ambas plataformas.autoRefreshEnabled (iOS) y AUTO_REFRESH_ENABLED (Android) recargan la página al volver al primer plano; déjalos desactivados en apps con formularios largos.remainSplashOption desactivado y una primera petición lenta, eso es exactamente lo que ve el revisor, y una pantalla en blanco es un hallazgo típico de la directriz 2.1 (cómo solucionar la 2.1).Apple exige una launch screen, que el proyecto iOS de WebViewGold ya incluye. La splash con tu marca que va encima es opcional, pero en una app que carga una app web es la forma práctica de evitar una pantalla blanca mientras se carga la primera página.
Lo que tarde en cargar la primera página y ni un momento más. remainSplashOption (iOS) y REMAIN_SPLASH_OPTION (Android) hacen exactamente eso; añade un tiempo mínimo de alrededor de un segundo solo si una carga muy rápida hace que el logo parpadee.
La página ha cargado, pero tu single-page app todavía no ha renderizado, o su fondo es distinto del color de la splash. Pon un color de fondo inline en el elemento html, renderiza un esqueleto de carga de inmediato y mantén idéntico el color de la splash.
Sí, splash.gif puede ser animado en ambas plataformas. Que sea cuadrado, ligero y más corto que el tiempo de carga habitual, para que los usuarios no lo vean cortarse a mitad de la animación.
No automáticamente: los cambios de ruta en el cliente y las llamadas fetch no son cargas de página. Usa spinneron:// y spinneroff:// alrededor de las operaciones largas, y esqueletos de carga para las cortas.
El mismo resultado, con distinta cantidad de trabajo por tu parte. Las tres incluyen la garantía de aprobación y soporte humano 24/7.
$109 por plataforma, pago único
La licencia de WebViewGold: un proyecto de Xcode o Android Studio listo para usar. Pega tu URL, define nombre e icono, activa funciones, compila y envía. Actualizaciones gratuitas para siempre.
Ver planes en la página principal$349 por licencia, complemento de pago único
Sin Mac, sin Xcode, sin Android Studio: configura en el navegador, compilamos ambas apps en la nube y las entregamos a App Store Connect y a Play Console.
Cómo funciona el Cloud Builder Prueba la demo gratuita$698 por plataforma $798
Envíanos tu URL y tu icono. Nuestro equipo configura, compila y entrega tu app en 72 horas, en marca blanca y con los proyectos fuente. Ambas plataformas por $1,158.
Detalles del Full Service Con tecnología de
Precios de la Oferta de invierno válidos hasta el 31 de diciembre de 2026.
Garantía de aprobación en App Store & Google Play – o te devolvemos el dinero en 14 días
¿Prefieres delegarlo? Full Service: configuramos, compilamos y entregamos en 72 horas, desde $698 por plataforma. ¿Preguntas? Chatea con nosotros 24/7.
Los reembolsos se conceden bajo las condiciones indicadas en nuestras FAQ: un rechazo por motivos ajenos al contenido por parte de Apple y/o Google, reclamado dentro de los 14 días posteriores a la compra.