Progressive Web Apps

Mejora de de las aplicaciones web para que parezcan aplicaciones nativas.

Características:

• Indistinguible de una aplicación nativa
• Funciona sin conexión a Internet.
• Utiliza características nativas del dispositivo.
• Se actualiza constantemente
• Atractiva para los usuarios
• Confiable
• Pesa poco
• Rápida en la carga

La gente pasa el 87 % de su tiempo en el móvil en aplicaciones nativas porque:

• Tienen notificaciones push (se comunican con el usuario, aunque la aplicación no esté abierta)
• Acceso a características del dispositivo: cámara, audio…
• Posibilidad de trabajar offline

Problemas de crear aplicaciones nativas:

• Aprendizaje de dos lenguajes diferentes (Android y iOS).
• Necesidad de instalación desde tienda de aplicaciones.

Para convertir una aplicación web en una PWA se necesitan los siguientes elementos:

• Push server
• Manifest
• indexedDB
• Service Worker

Corazón de una PWA. Archivo de JavaScript (sw.js o service-worker.js). Funciona como una especie de proxy. Cuando estamos en una PWA y realizamos una petición, esta es interceptada por el service worker quien, dependiendo de las condiciones indicadas, obtiene los recursos desde local (caché) o los solicita a Internet.

navigator.serviceWorker.register("/sw.js")

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 “parsea”
• Instalado:
• Activación: código que se puede ejecutar antes de que se active el Service Worker
• 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

Archivo JSON que indica la apariencia que tendrá la aplicación cuando esté en el Home Screen del teléfono.

Permite grabar información en base de datos aunque el usuario no tenga conexión en ese momento.

Permite enviar notificaciones push a la PWA.