Introducción a PWA

Mi charla sobre Introducción a PWA fue aceptada en el WordCamp San José 2019, evento que se realizó los días 7 y 8 de Setiembre. Si hay feedback ó sugerencias para mejorar la charla y/o mi manera de exponer, me pueden tuitear @leivajd ó escribir a leivajd [@] gmail.com.

Slides: Introducción a PWA

Abajo quedan los recursos que he usado como base para trabajar y que son la base de la charla.

Lectura obligatoria

El punto de partida, la documentación "oficial":

• Going Offline de Jeremy Keith. Posiblemente el mejor recurso para iniciar, por ser corto, fácil de seguir y práctico.
• Service Workers: an Introduction. - Google
• The Service Worker Lifecycle. - Google
• The Web App Manifest. - Google
• The Offline Cookbook. - Google

Sobre PWA

The name isn’t for you and worrying about it is distraction from just building things that work better for everyone. The name is for your boss, for your investor, for your marketeer.

La cita anterior es de Frances Berriman, de su post Naming Progressive Web Apps, buena lectura. También vale la pena leer Progressive Web Apps: Escaping Tabs Without Losing Our Soul, de Alex Russell, son lecturas que tiran una luz sobre el origen del nombre.

• Getting Started with Progressive Web Apps. - Google.
• Your First Progressive Web App. - Google.
• Add to Home Screen. - Google. Criterios para que Chrome despliegue el prompt de Add to Home Screen.
• The Building Blocks Of Progressive Web Apps. - Smashing Magazine.
• Progressive Web Apps Training. - Google. Lo dejo de último porque es más largo, pero cubre las diferentes partes.

Entre más leía y probaba Services Workers, más miedo me daba quedar "atrapado" con un Service Worker defectuoso. Esto me llevo a meterle tiempo a encontrar como "matar" un Service Worker, aquí quedan algunos links interesantes:

• Kill Switch; un ejemplo dentro de la especificación de Clear Site Data de la W3C
• Mess up & learn: service worker caching gotchas.
• Fresher service workers, by default - Google
• How to Uninstall, Unregister or Remove a Service Worker.
• Alexander Pope: ServiceWorkers Outbreak | JSConf EU 2017. Un buen video para subir el nivel de ansiedad :D

Publicar en Play Store

Google permite que un PWA se publique en Play Store, bajo el concepto de Trusted Web Activities (TWA).

• Using Trusted Web Activities - Google.
• Trusted Web Activities Quick Start Guide - Google.

Con estos post hay que validar que aún aplique, hace 3 meses eran válidos, a hoy no sé.

• I built a Progressive Web App and published it in 3 app stores. Here’s what I learned...
• Google Play Store now open for Progressive Web Apps.
• This TWA stuff rocks! Finally I got my PWA on Google Play Store.
• Trusted Web Activity - PWA to Play Store Guide.

Herramientas

• Progressive Web App Checklist - Google.
• What Web Can Do Today. Util para visualizar el estado de APIs disponibles en el browser.
• Serviceworke.rs. Un cookbook de MDN.
• PWA Builder. Un proyecto comunitario de Microsoft.
• Workbox. Es una serie de librerias y modulos de Node que nos permiten facilitan integrar la creación del Service Worker, usando Webpack ó Grunt, y crear estrategias de cache sin tanto boilerplate.