Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Progressive Web Apps con Angular

Progressive Web Apps con Angular

Alfredo Bonilla

February 27, 2020
Tweet

More Decks by Alfredo Bonilla

Other Decks in Programming

Transcript

  1. PROGRESSIVE WEB APPS Alfredo Bonilla @brolag Co - Organizador @

    GDG Pura Vida Co - Organizador @ Angular Costa Rica Web Practice Lead @ Gorilla Logic # Q U E D A T E E N C A S A
  2. @brolag ¿Qué son las PWA? Confiables Rápidas Atractivas Son aplicaciones

    web capaces de proveer al usuario una experiencia similar a una aplicación móvil nativa.
  3. Alto rendimiento Funcionalidades offline Push notifications App Shell Icono en

    el escritorio Actualizaciones automáticas @brolag ¿Qué características tienen?
  4. @brolag ¿Por qué a nuestros clientes les interesa? Incrementos en

    las tasas de conversión Incrementos en el porcentaje de adquisición de usuarios Incremento en el tiempo invertido en el sitio Incremento en los ingresos generados por usuario
  5. @brolag ¿Qué son los service workers? Un service worker es

    un script que tu navegador ejecuta en segundo plano, separado de una página web, abriéndoles la puerta a funciones que no necesitan una página web ni interacción de usuario.
  6. @brolag Prerequisitos para crear una PWA con Angular Usar las

    últimas versiones de Angular y Angular CLI Para que los service workers se registren el app se debe accesar utilizando HTTPS excepto cuando desarrollamos de manera local
  7. Otras cualidades de los Service Workers en Angular Integridad de

    recursos Permite configurar diferentes estrategias de registro con SwRegistrationOptions Fail-safe @brolag
  8. @brolag PWA Checklist HTTPS Páginas responsivas Todas las URL cargan

    sin conexión Metadata para agregar al escritorio Permite una carga rápida incluso en 3g Cross browser Transiciones fluidas
  9. PROGRESSIVE WEB APPS Alfredo Bonilla @brolag # Q U E

    D A T E E N C A S A Gracias por su atención