Como has encontrado el camino a esta entrada del blog, probablemente has escuchado el término PWA en alguna parte. Bien por ti: las PWA son por lo que se recordará el año 2018, así que estás justo en el filo de la navaja. ¡Qué emocionante! En esta entrada del blog, explico qué significa realmente el término y por qué debería importarte.
(fuente: sitio de Google Developer)
¿Qué es una PWA?
PWA significa Aplicación Web Progresiva. Vamos a examinarlo dividiéndolo en dos partes. Las dos últimas palabras («Aplicación Web») hablan por sí solas. Las PWA son aplicaciones web. Aquí, aplicación web significa simplemente una aplicación que se ejecuta como un sitio web como, por ejemplo, Twitter. La primera parte del término -Progresivo- significa que la experiencia del usuario se mejora gradualmente en función de las capacidades del navegador. Esencialmente, esto significa que la aplicación web funciona bien en los navegadores más antiguos, pero puede utilizar las nuevas tecnologías para mejorar la experiencia si el usuario utiliza un navegador que las soporte. Suena sencillo, ¿verdad? Entonces, ¿de dónde viene el término?
Progresivo significa que la experiencia del usuario se mejora gradualmente en función de las capacidades del navegador
El término fue introducido por el ingeniero de Google Chrome Alex Russell en su entrada de blog en 2015. Desde entonces, Google ha promovido su uso de forma activa y ha proporcionado una gran cantidad de recursos sobre el tema, como un sitio que los explica con más detalle.
Mientras doy presentaciones en torno a las PWA siempre me encuentro con la misma confusión en este punto. «Entonces… ¿Es una tecnología? ¿Es un estándar? Es algo que pertenece/patentado por Google?». No, nada de eso. Es simplemente un término para describir una forma específica de diseñar y construir aplicaciones. A continuación, vamos a tratar de entender lo que son repasando las características.
Aquí están las 9 características originales de PWA por Alex Russell con una explicación de lo que significan en este contexto:
- Responsive: La página se ve bien en diferentes tamaños de pantalla (por ejemplo, teléfono, tableta, escritorio)
- Independiente de la conectividad: Funciona sin conexión a Internet
- Interacciones similares a las de una aplicación: Look’n’feel de aplicación nativa
- Fresco: Siempre actualizada
- Segura: Utiliza una conexión segura para mitigar múltiples tipos de amenazas de seguridad
- Detectable: Los navegadores identifican las PWA de forma automática
- Realizable: Puede hacer que los usuarios vuelvan a la app utilizando, por ejemplo, notificaciones push
- Instalable: Puede almacenarse en la pantalla de inicio al igual que las aplicaciones nativas, pero sin la molestia adicional de la App Store
- Enlazable: Se pueden compartir por ahí como URLs simples
Para el lector de esta entrada de blog las funcionalidades más importantes son:
- Instalabilidad en la pantalla de inicio
- Acceso a múltiples APIs nativas como cámara, geolocalización, vibración, pagos, etc.
- Soporte para notificaciones push
- Uso offline
- Soporte para pantalla completa y pantalla de inicio
(fuente: post del blog de Alex Russell)
Para concluir todo lo anterior, las PWAs pueden hacer la mayoría de las cosas que las aplicaciones nativas pueden hacer y la brecha entre lo que las aplicaciones nativas y web pueden hacer se está reduciendo cada vez más.
¿Por qué ahora?
A estas alturas puedes estar pensando que todo esto suena tan bien que debe haber una trampa ya que las PWAs no son la forma por defecto de implementar aplicaciones. Sí, tienes razón. Hay una pega. Ha habido una falta de soporte para las tecnologías que potencian las PWAs en algunos entornos. La compatibilidad con Android existe desde hace tiempo, a partir de Android 5, lo que significa que más del 80% (fuente: estadísticas de Android de Google) de los dispositivos Android de todo el mundo admiten las tecnologías necesarias para implementar las PWA. La adopción es aún mayor si sólo se considera Europa o Norteamérica. Así que el soporte de Android ya es realmente bueno.
Desafortunadamente, el otro actor clave que comparte el mercado de los teléfonos móviles no ha estado demasiado ansioso por implementar las tecnologías (lea por qué). El soporte de iOS ha estado ausente, impidiendo así una mayor adopción de las PWA. Pero a partir de la próxima versión de iOS 11.3, el soporte estará disponible también para iOS. Por suerte, la adopción de nuevas versiones de iOS es relativamente rápida, por lo que se puede suponer que un alto nivel de soporte estará disponible a finales de este año. Como referencia, las versiones 10 y 11 representan el 93% de todas las versiones de iOS que se utilizan por ahí, según Apple.
Aunque el enfoque cuando se habla de PWAs suele ser en el entorno móvil, también funcionan para el escritorio. A principios de este mes hubo un importante anuncio por parte de Microsoft afirmando que las PWAs son ahora compatibles con Edge y Windows 10. Chrome y Firefox ya soportan PWAs y también lo hará la próxima versión de Safari de escritorio.
Ejemplo: Twitter Lite
El ejemplo más famoso de PWAs es la versión PWA de Twitter llamada Twitter Lite (pruébala con Android o escritorio en mobile.twitter.com). Twitter también ha publicado su razonamiento detrás de la construcción de la versión PWA. Por destacar algunos de los datos del post, en comparación con su aplicación nativa, el tamaño de la versión PWA es sólo del 1 al 3% y el tiempo medio de carga es un 30% menor.
Otros ejemplos conocidos de PWAs incluyen Forbes, Trivago, Washington Post, Telegram, Alibaba y más recientemente Google Maps Go. También hay un directorio de PWAs disponible.
Conclusiones
Se espera que el año 2018 sea el año de las PWAs. Las herramientas ya están a un gran nivel y cada vez aparecen más PWAs. Una vez que el soporte en iOS esté altamente disponible, las PWAs se convierten en una opción realista para las apps nativas. En caso de que estés considerando si las PWAs son la opción correcta para ti, vuelve pronto ya que escribiré una guía sobre ¿Debería hacer una PWA en lugar de una aplicación nativa?
Gofore ya tiene experiencia en PWAs y también posee una amplia experiencia en la construcción de aplicaciones web responsivas, de gran aspecto, offline-first y eficientes. Si necesitas ayuda con la elección de la arquitectura, el diseño o la implementación de PWAs, no dudes en ponerte en contacto con nosotros.
Otras lecturas del blog de GOFORE
Transformación ágil en acción – Parte 1
Transformación ágil en acción – Parte 2
¿Cuál es el punto de escalar ágil