PWA (Progressive Web App) no es un término nuevo (Google lo introdujo en 2015), pero es desconocido para muchas personas. Las PWA se definen comúnmente como las Apps que reúnen lo mejor de las aplicaciones web y de las nativas, incluso llegando a ser entendidas como un punto medio o una forma evolucionada.

La base son páginas webs, pero utilizan tecnologías que hacen que su estética y funcionamiento se asemejen enormemente a una App nativa, por ejemplo, mediante la ejecución en segundo plano. Se accede a ellas a través de un navegador, pero se puede anclar un acceso directo en nuestro dispositivo (en la pantalla de inicio o en el menú de aplicaciones). No dependen de sistemas operativos (se ejecutan en el navegador) y van incorporando funcionalidades nativas del dispositivo.

Para entender en mayor profundidad el funcionamiento de las PWA, es interesante mencionar las tecnologías y métodos de trabajo en los que se sustenta su desarrollo. Siguiendo a Google, los requisitos en esta materia que debería cumplir una Progressive Web App son cuatro:

En Android y Chrome se utiliza un archivo JSON muy sencillo, conocido como Manifiesto. Este permite especificar diversas características para controlar cómo se visualizará la App tras ser instalada. Algunas de las informaciones que contiene son:

• Nombre (name y short_name)
• Icono (icons), lo que se ve en la pantalla de inicio o menú tras instalarla
• Colores (theme_color para la barra superior y background_color para la pantalla de carga de la App)
• Orientación (orientation), es decir, si la App se mostrará en horizontal o en vertical
• Descripción (description): breve descripción de la App
• URL que se iniciará al abrir la App (start_url)
• Display (display), con distintas configuraciones para la pantalla

La tecnología de service workers es una especie de proxy entre el servidor o la red y el dispositivo o la aplicación. Es un JavaScript que se instala en el navegador y funciona detectando eventos. Requieren del uso de HTTPS.
Funcionan independientemente de la aplicación, en segundo plano y sin importar que esta esté cerrada. Gracias a ellos, la Progressive Web App puede ser utilizada sin conexión, puesto que se guardan datos en caché y hace un almacenamiento offline. Además de esto, permiten enviar notificaciones push.

Necesario para mostrar el acceso directo en el cajón de aplicaciones o la pantalla de inicio del dispositivo. Va estrechamente vinculado al manifiesto de la aplicación mencionado previamente.

Es igualmente interesante mencionar App Shell. La idea se basa en que una Progressive Web App se podría dividir en dos grandes bloques: estructura de la App y contenido. Por tanto, este modelo consiste en que la App shell (la interfaz básica, la parte funcional) se almacene en la caché del service worker la primera vez que la App se inicie. De este modo, esta estructura se podrá visualizar sin conexión y hace que el tiempo de carga parezca menor, ya que el usuario accede a la estructura de forma muy rápida. El contenido se carga por otro lado, que puede ser desde la propia web o también cargado en caché, en cuyo caso se deberá esperar a una red para que sea actualizado.
Por último, como ya se ha mencionado antes, el diseño responsive es esencial, ayudando a que la App se asemeje a una nativa, con elementos como animaciones CSS o frameworks.

La PWA debe servir todas las solicitudes sobre HTTPS, puesto que es necesario confirmar que funcione bajo un protocolo de seguridad. Además, para la instalación del service worker termina siendo un paso fundamental, ya que estos almacenan mucha información, por lo que se debe navegar de forma cifrada para mantener la protección.