informatica:programacion:pwa
Diferencias
Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anteriorRevisión previaPróxima revisión | Revisión previa | ||
| informatica:programacion:pwa [2020/11/18 15:55] – [Service worker] tempwin | informatica:programacion:pwa [2020/11/18 18:40] (actual) – [Conceptos clave] tempwin | ||
|---|---|---|---|
| Línea 5: | Línea 5: | ||
| Características: | Características: | ||
| - | * Confiable: carga rápida y ofrece funcionalidad offline | + | * Indistinguible de una aplicación nativa |
| - | * Rápida: respuesta rápida | + | * Funciona sin conexión |
| - | * Atractiva: que parezca una aplicación móvil | + | * Utiliza **características nativas |
| + | * Se **actualiza constantemente** | ||
| + | * Atractiva | ||
| + | * Confiable | ||
| + | * **Pesa poco** | ||
| + | * Rápida en la carga | ||
| La gente pasa el 87 % de su tiempo en el móvil en aplicaciones nativas porque: | La gente pasa el 87 % de su tiempo en el móvil en aplicaciones nativas porque: | ||
| Línea 20: | Línea 25: | ||
| * Necesidad de instalación desde tienda de aplicaciones. | * Necesidad de instalación desde tienda de aplicaciones. | ||
| - | ===== Conceptos ===== | + | ===== Arquitectura ===== |
| + | |||
| + | Para convertir una aplicación web en una PWA se necesitan los siguientes elementos: | ||
| + | |||
| + | * Push server | ||
| + | * Manifest | ||
| + | * indexedDB | ||
| + | * Service Worker | ||
| + | |||
| + | ===== Conceptos | ||
| + | <WRAP center round important 60%> | ||
| + | Las aplicaciones PWA deben ser servidas utilizando un protocolo seguro (HTTPS) y contar con un certificado. La única excepción es http:// | ||
| + | </ | ||
| ==== Service worker ==== | ==== Service worker ==== | ||
| - | Corazón de una PWA | + | Corazón de una PWA. Archivo de JavaScript ('' |
| + | <code javascript> | ||
| + | navigator.serviceWorker.register("/ | ||
| + | </ | ||
| + | |||
| + | El service worker corre en un hilo separado de la aplicación web, de forma que aunque cerremos la aplicación web, el service worker seguirá funcionando. | ||
| + | |||
| + | Ciclo de vida: | ||
| + | |||
| + | * Instalando: se descarga el fichero JavaScript y se " | ||
| + | * Instalado: | ||
| + | * Activación: | ||
| + | * Activado: el service worker toma control de la aplicación. | ||
| + | * Ocioso: el service work falla en la instalación o es sustituido por versiones nuevas. Ya no tiene control de la aplicación | ||
| ==== Manifest ==== | ==== Manifest ==== | ||
| + | |||
| + | Archivo JSON que indica la apariencia que tendrá la aplicación cuando esté en el Home Screen del teléfono. | ||
| + | |||
| + | ==== indexedDB ==== | ||
| + | |||
| + | Permite grabar información en base de datos aunque el usuario no tenga conexión en ese momento. | ||
| + | |||
| + | ==== Push Server ==== | ||
| + | |||
| + | Permite enviar notificaciones push a la PWA. | ||
| + | |||
informatica/programacion/pwa.1605711331.txt.gz · Última modificación: por tempwin
