Progressive Web Apps: Lo mínimo que deberías saber sobre el futuro de las web móviles y las PWAs.

Curso de Desarrollo Web Online 2016

COMPARTE ESTE ARTÍCULO Y MUESTRA LO QUE APRENDISTE

¿Qué son las Progressive Web Apps (PWAs)?

Una Progressive Web App (PWA o Aplicación Web Progresiva en español) es técnicamente una página web responsiva estándar pero que a los ojos del usuario puede parecer una aplicación tradicional (de escritorio) o una apliación móvil (nativa). Esto se logra mediante el uso de funcionalidades avanzadas de HTML5 y APIs intrínsecas del navegador (cuando éste tiene soporte para PWAs).

Este nuevo tipo de aplicación intenta combinar características ofrecidas por la mayoría de los navegadores modernos con los beneficios de la experiencia móvil (mobile UX). En la actualidad, las PWAs están soportadas plenamente en el sistema operativo Android a través de su navegador Chrome mediante la opción de “Agregar a la Pantalla Principal”.

Las PWAs corren en un entorno seguro para cualquiera que use el navegador Chrome. Debido a que estas aplicaciones son accedidas e instaladas usando una URL desde el navegador móvil, no requieren el típico y tedioso proceso de instalación de apps desde la Play Store. Además se ejecutan sobre el protocolo HTTPS minimizando la posibilidad de que alguien pueda inyectar código malicioso o sustraer tus datos privados durante la comunicación.

A medida que se vaya consolidando esta tecnología, se irán expandiendo o bien introduciendo conceptos nuevos, simples pero con grandes potencialidades como es el caso de:

Responsividad: La interfaz del usuario (UI) se adapta a las dimensiones (form factor) del dispositivo: PC, smartphone y tablet.
Apariencia Nativa (App-like): Cuando se interactúa con una PWA, luce y se siente como una App nativa.
Independiente de la Conectividad: Trabajará sin conexión (mediante Service Workers) o en areas de poca conectividad.
Capaz de re-enganchar: A través de características como push notifications, los usuarios deberían poder seguir enganchados y usando la app con regularidad.
Instalable: Un usuario debería ser capaz de agregarla a su pantalla principal (home), y ejecutar la aplicación desde un icono cada vez que quiera volver a utilizarla.
Accesible: Debe poder ser identificada fácilmente como una aplicación y ser encontrada por los motores de búsqueda.
Fresca: Ofrecer contenido nuevo en la app cuando el usuario se conecte a internet.
Segura: La aplicación se ejecuta vía HTTPS para prevenir infiltración de contenidos y ataques de intrusos (man-in-the-middle).
Progresiva (de avanzada): Independientemente de la elección del navegador, debería poder funcionar igual para todos los usuarios.
Enlazable: Debería ser fácil de compartir vía URL.

Las PWAs desde la perspectiva de un Usuario habitual de apps

Una de las mayores ventajas que ofrece una PWA es su bajo impacto en cuanto a la descarga e instalación de la app al dispositivo. Por ejemplo: twitter ofrece una app del tipo PWA que puedes probar al acceder a https://mobile.twitter.com desde tu dispositivo Android usando el navegador Chrome. La descarga inicial de la app está alrededor de ~350Kb y posteriormente 5Kb adicionales que son usados por la caché y los service workers.

Las PWAs son ideales para usuarios en redes más lentas ya que carga las páginas más rápidamente y ofrece todas las características de las apps nativas en un formato que es menos intensivo en el uso de los recursos.

Las PWAs desde la perspectiva de un Proveedor de Apps

Para una agencia que genera y publica apps constantemente, la mayor ventaja radica en el ahorro en términos de desarrollo y mantenimiento. Es un hecho aceptado por la mayoría, que las compañías desarrolladoras de apps se inclinan más hacia la creación de aplicaciones nativas o híbridas. El proceso de desarrollo de aplicaciones nativas es bastante más complicado en tanto requiere soporte para diferentes plataformas, versiones y dispositivos.

Para el momento en que Google sugirió adoptar el concepto de las Progressive Web Apps se encontraban trabajando en las estrategias de desarrollo de aplicaciones móviles de varias compañías de renombre como The Wahington Post, The Guardian, The Weather Channel, Flipkart, Alibaba y AliExpress y las ayudaron a construir una mejor presencia web móvil. Una de las métricas clave para cualquier equipo de mercadeo es el Costo de Adquisición de Clientes (CAC). Selio, una app para un marketplace local, declaró que el promedio del Costo de Aquisición de Clientes usando su PWA es sorprendentemente 10 veces menor que el CAC para sus apps nativas.

La Tasa de Conversión es otra métrica importante que refleja las transacciones reales hechas por los usuarios adquiridos. Luego de implementar su PWA, AliExpress vió incrementada su tasa de conversión para nuevos usuarios en 104%. Esta inversión en la mejora de su presencia web móvil también le significó un aumento en la tasa de conversión del 82% para usuarios de Safari. La nueva estrategia también se tradujo en una mejor experiencia. Los usuarios visitan ahora dos veces más páginas por sesión y el tiempo que pasan en cada sesión se aumentó en promedio un 74% considerando todos los navegadores.

Las PWAs desde la perspectiva del Desarrollador

Desafortunadamente, no son buenas noticias para los desarrolladores de aplicaciones Nativas o Híbridas. La cantidad de tiempo y esfuerzo que implica aprender lo necesario y aplicarlo para iniciarse en el desarrollo de aplicaciones Nativas o Híbridas, así como su mantenimiento y liberación, son considerablemente más grandes cuando se comparan con las PWAs. Como se mencionó anteriormente, la mayoría de las aplicaciones móviles que usamos hoy en día pueden ser fácilmente convertidas en PWAs, y una vez hecho esto, no es necesario tener ya un equipo de desarrolladores en lenguajes Nativos o Híbridos dedicados exclusivamernte para estas tareas.

Si analizamos detenidamente los requerimientos de los interesados en publicar una App, una PWA cubriría sus necesidades en el 90% de las veces.

Los que más ganan aquí son los desarrolladores web. Las Progressive Web Apps no son sólo una tecnología, son un conjunto de tecnologías que puedes usar para mostrar de manera progresiva y amplia, características de las apps (nativas) en tus sitios web de siempre. Si los desarrolladores web ampliaron sus conocimientos para crear extraordinarios sitios web completamente responsivos, deberían ser capaces también de incorporar facilmente los conocimientos necesarios para agregar funcionalidades extras propias de las PWAs, como las push-notifications, el soporte sin conexión, y el manejo dinámico de contenidos, entre otros.

Finalmente, la aceptación de los requerimientos necesarios para las PWAs en los diferentes navegadores ha ido creciendo, al punto de que Safari, que ha sido siempre un navegador bastante particular debido a las restricciones de iOS, ya ha empezado a implementar funcionalidades como “Agregar a la Pantalla de Inicio”, soporte sin conexión, etc. aún cuando todavía no lo hace en la forma estándard de las PWAs. Al parecer la comuinidad de Webkit, el motor de código abierto en el que se basa Safari, ha empezado a escuchar los requerimientos de la industria al incluir en su Plan de Cinco Años, consideraciones como “Aquello que se convierta en un requerimiento más frecuente. Deberíamos incluirlo.”.

Sólo falta Safari por sumarse al soporte completo de Service Workers, componente fundamental de las PWAs.

Fuente: https://jakearchibald.github.io/isserviceworkerready/

En el momento en que iOS de soporte y adopte de forma general los estándares propuestos por las Progressive Web Apps, la industria del Desarrollo Móvil estará lista para cambiar su curso hacia esta nueva dirección.

Fuente: Why Progressive Web Apps (PWA) is not good news for Native and Hybrid app developers

Si quieres ver como funcionan las Progressive Web Apps ya mismo, visita http://pwa.rocks desde tu navegador móvil Chrome.