HEADER_lecciones_de_software

¿Qué  son aplicaciones web progresivas?

por Sebastián Mora, el 19 de septiembre de 2017

H_aplicaciones_web_progresivas

Las aplicaciones web progresivas (PWA) son una iniciativa liderada por Google para combinar lo mejor de la web con las aplicaciones móviles y de esa forma desarrollar una única aplicación que sea funcional en ambos canales.

Dichas aplicaciones pueden ser construidas mediante Service Worker, una API web que nos permitirá realizar procesos en background, incluso sin que nuestras aplicaciones estén actualmente corriendo. Esta API web la podemos ver como un proxy programable que nos permitirá tener un control inteligente de nuestras peticiones HTTP y  la forma en que se cachean nuestros recursos.

infografia-apps-web-progresivas

¿Cómo funcionan las apps web progresivas?

El funcionamiento de las apps web progresivas es bastante sencillo. Cuando hacemos una petición HTTP para obtener un recurso, el Service Worker primero chequea si dicho recurso se encuentra en la caché. En caso de que se disponga de tal recurso, la petición termina y el Service Worker retorna el recurso. De esta forma, si nuestra aplicación está off-line, igual podríamos obtener los recursos y mostrarles algo a nuestros usuarios.

Por otro lado, cuando esté on-line, se ganará tiempo de carga de nuestra app, ya que la petición no va hasta el servidor. ¿Pero qué pasaría si el recurso no se encuentra en caché? El Service Worker traería dicho recurso del servidor, lo cachea para próximas peticiones y lo entrega a nuestra aplicación.

Algo importante que se debe recalcar es que este Service Worker solo trabajará con protocolo HTTPS y localhost (para facilidad en pruebas). Así nos aseguramos de que el caché no ha sido manipulado de otra forma.

Actualmente, los Service Workers son soportados por Chrome, Firefox y Opera; Edge se encuentra en desarrollo.

Características de las aplicaciones web progresivas

Las aplicaciones web progresivas traen consigo una serie de características bastante interesantes, con las que solo contaban las aplicaciones móviles. Por ejemplo:

Funcionamiento off-line

    • Las aplicaciones web progresivas podrán mostrarle algo al usuario cuando este se encuentre off-line y reducir un poco la frustración que se da en estos casos. Es importante tener cuidado con esto, ya que, si mostramos información de una base de datos que ha sido cacheada, el usuario debe saber que esta tal vez esté desactualizada.

Facilidad de acceso

    • La aplicación se puede enlazar al screen home del celular. De esta forma el usuario ya no tendrá que ir al navegador para buscar de nuevo nuestra aplicación: bastará con acceder desde el icono creado en el celular. La aplicación abrirá con un splash y sin la barra de navegación del navegador (full screen).

Notificaciones push

  • Ahora podemos hacer uso de notificaciones push en nuestras aplicaciones. Esta es una forma de invitar a los usuarios a interactuar de nuevo con nuestra app.

Beneficios de las aplicaciones web progresivas

  • Progresivas: mejoras progresivas como principio central.
  • Adaptabilidad: se adaptan a dispositivos móviles o tabletas (responsive design).
  • Conectividad: trabajan sin conexión o con redes de baja calidad.
  • Rapidez: la carga de nuestra aplicación será mucho más rápida mediante los service workers.
  • Interfaz: se asemeja a la de una aplicación móvil, pero sin barra de navegación.
  • Seguridad: trabajan bajo protocolo HTTPS para garantizar que el contenido no sea manipulado por intrusos.
  • Instalación: permiten a usuarios conservar las apps en el screen home del celular.
  • Interacción: facilitan la posibilidad de volver a interactuar a través de funciones como notificaciones push.

¿Por qué deberíamos desarrollar aplicaciones web progresivas (PWA)?

El proceso de instalación de una aplicación móvil se puede resumir en los siguientes pasos: cargar la tienda de aplicaciones, encontrar la app, hacer clic para instalar, aceptar permisos y esperar la descarga. Cada paso de este proceso provoca una gran pérdida de usuarios.

Por el contrario, con las PWA, bastará con conocer la URL, ir al navegador y agregar la aplicación en el screen home de nuestro celular, que crea un acceso directo a la aplicación.

Según ComScore Mobile Metrix, el tiempo invertido por los usuarios en sus celulares es del 13% en aplicaciones web y 87% en aplicaciones móviles. Es importante entonces que la usabilidad de nuestras aplicaciones web sean similares a las que ofrecen las móviles.

Asimismo, 40% de los usuarios abandonan una página cuando esta se demora más de tres segundos en cargar. El control inteligente de la caché a través de los service workers reducirá en gran proporción estos tiempos de carga.

El control y el manejo de la caché y las peticiones HTTP son más inteligentes, así podremos controlar qué se hace con cada petición y recurso obtenido. En caso tal que la aplicación se encuentre off-line, podríamos tener un determinado recurso para mostrar al usuario .

Definitivamente, las PWA son un gran cambio en la forma de construir aplicaciones web, pues mejoran en gran medida la usabilidad y la experiencia de usuario. Como en su momento el diseño responsive pasó de ser un “plus”, a ser parte de las buenas prácticas y algo que prácticamente debe de hacerse en todas las aplicaciones, me atrevo a decir que este será el camino de las PWA.

Conoce las claves para tener una transformación digital ágil

Temas:Tecnologia e Innovacion

Lecciones Pragma

Lecciones en Academia Pragma

Aquí encontrarás tutoriales técnicos para que apliques en temas de desarrollo de software, cloud, calidad en software y aplicaciones móviles. 

También puedes visitar nuestro Blog con contenido actual sobre Transformación Digital, Marketing, Conocimiento de Usuario y más. 

Blog

Suscríbete a la academia

Descarga la Guía para trabajar con ambientes IBM Websphere Portal