Colores Power BI
Mejora la visualización de tus informes de Power BI (Parte II)
26 marzo, 2019
Mixed Reality
Creando real-time apps en Mixed Reality (Parte II)
28 marzo, 2019

En el primer post pudimos ver qué son las Progressive Web Apps (PWAs) y qué principios tecnológicos se han de tener en cuenta para poder desarrollarlas. Ahora es necesario abordar cómo estructurar el frontend para que nuestra PWA pueda ser accedida offline con mayor facilidad, cómo está el panorama de las PWAs más allá del móvil y qué beneficios aportan las mismas, cuestiones que trataremos en este artículo.
 

1. Application Shell Architecture

Ésta es la forma recomendable de crear una PWA para aplicaciones con contenido dinámico, aportando el beneficio de crear una aplicación que carga al instante y de forma desconectada en la pantalla del usuario de una forma similar a las aplicaciones nativas.

La base de esta arquitectura consiste en identificar la shell de la aplicación, lo que no es más que la cantidad mínima de HTML, CSS y JS necesarios para iniciar la interfaz de usuario, es decir, el esqueleto de la UI de la aplicación. Sería el equivalente a los recursos que se empaquetarían y distribuirían en una aplicación nativa para una de las tiendas.

Application shell para Progressive Web Apps

Esta shell de aplicación debe ser almacenada en caché para que en los accesos a la aplicación se cargue de forma instantánea y sin conexión, mientras que el contenido dinámico debe ser cargado en la aplicación mediante Javascript. En SPAs con mucho código Javascript, este enfoque sigue siendo válido, puesto que, como shell, puedes almacenar el HTML inicial y gestionar el resto de la aplicación mediante Javascript.

A este respecto, recomiendo la siguiente lectura: https://medium.com/google-developers/instant-loading-web-apps-with-an-application-shell-architecture-7c0c2f10c73.
 

2. Progressive Web Apps en escritorio

Las PWAs surgieron como una solución móvil para dejar de lado las soluciones híbridas. Sin embargo, el uso de aplicaciones de escritorio es muy importante, ya que, mientras que los picos de uso de aplicaciones móviles se producen por la mañana y por la tarde, el uso de aplicaciones de escritorio se distribuye a lo largo del día (esto es debido al uso que se hace de estas aplicaciones en los centros de trabajo). Por ello, tener la aplicación instalada y con un feel nativo pasa a ser un punto a tener en cuenta en la experiencia del usuario.

Los principios para el desarrollo de una PWA de escritorio son los mismos que para el desarrollo móvil. Por lo tanto, la forma de comenzar a desarrollar con ellas es similar.

La forma común de llegar a una PWA es la web e instalarla desde allí. En escritorio es igual gracias a Google Chrome. Sin embargo, Microsoft ha ido un paso más allá en Windows 10, haciendo que estas aplicaciones puedan ser instaladas en la tienda, como si se tratase de una aplicación nativa más. Al lanzar estas aplicaciones se levantará una instancia del navegador Microsoft Edge.
 

3. Beneficios de las Progressive Web Apps

Al desarrollar utilizando este enfoque, conseguimos reutilizar el conocimiento de equipos de desarrollo web para el desarrollo móvil, pero, a diferencia de otras alternativas como pudo ser en el pasado Apache Cordova, las PWAs nacen a partir de la estandarización, lo que permite llegar a usuarios de diferentes sistemas operativos de la misma forma que una web. Esto cobra especial importancia dado que los navegadores web tendrán que soportar estos estándares tarde o temprano.

Por otro lado, al ser una web, las PWAs son susceptibles de ser indexadas por los buscadores, permitiendo que se pueda llegar a la aplicación desde un buscador y no sólo desde las tiendas. De esta forma, los usuarios pueden descubrir la web a partir de una búsqueda online y luego pasar a tener la experiencia al mismo nivel que una aplicación nativa.

Por último, al no pasar por las tiendas, las actualizaciones pasan a ser inmediatas, sin necesidad de una aprobación. Además, se reduce el coste de licencias, puesto que no es necesario tener licencia de desarrollo para comenzar a trabajar en estas aplicaciones.
 

Conclusiones

Las PWAs vienen pisando fuerte. Las técnicas con las que se construye una PWA se basan en estándares y buenas prácticas de desarrollo web, por lo que apostar por esta tecnología es apostar por:

  • Mejorar la experiencia de los usuarios aportando fluidez, rapidez y comportamientos similares a los nativos
  • Innovar utilizando los últimos estándares y tecnologías web
  • Reaprovechar el conocimiento obtenido en el desarrollo web
  • Crecimiento personal del equipo, que ve cómo sus competencias en desarrollo web aumentan al poner en práctica estándares recientes

Gracias a todos los beneficios que aportan las PWAs, éstas se convierten en un complemento perfecto para el CORE de negocio en una estrategia Mobile First. Es por ello que ya hay grandes empresas utilizando esta tecnología, como por ejemplo Twitter, Uber, Forbes o The Washington Post.
 
 
 
Podéis comentarnos lo que sea en info@kabel.es.

También podéis seguirnos en Twitter, LinkedIn y Facebook.
 
 


 

Compártelo: Share on FacebookTweet about this on TwitterShare on LinkedInPin on Pinterest

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

NEWSLETTER