Qué son y para qué sirven las aplicaciones web progresivas

Mucho se está hablando hace unos meses de las aplicaciones web progresivas, tecnología promovida por Google, pero seguramente no tengamos claro de qué se trate.

En el post de hoy trataremos de explicar qué son realmente las aplicaciones web progresivas, qué problemas ayudan a resolver y si realmente se trata de una nueva revolución en el desarrollo para smartphones.

El desarrollo de Apps

Durante este año ya hemos hablado de las opciones que tenemos cuando queremos realizar el desarrollo de una aplicación para dispositivos inteligentes. En concreto, en un post comentamos las diferentes opciones de desarrollo que teníamos haciendo hincapié en el desarrollo de aplicaciones híbridas.

También repasamos la diferencia entre aplicaciones nativas y aplicaciones híbridas en otro post sobre las apps hibridas vs nativas para entender en qué caso es mejor desarrollar de una forma o de otra.

Ahora tenemos otra opción que es el uso de aplicaciones web progresivas, pero ¿qué son?

¿Qué son las aplicaciones web progresivas?

Las aplicaciones web progresivas o PWA en inglés, no son más que aplicaciones web que aprovechan las últimas tecnologías de los navegadores para poder ofrecer al usuario de las mismas una experiencia mucho más cercana a una aplicación nativa que a una aplicación web.

A fecha de hoy, para poder realizar un desarrollo de web progresiva, necesitaremos las últimas versiones de Chrome o de Firefox, ya que el resto de navegadores aún no soportan estas tecnologías

En concreto, una aplicación web progresiva, todo y ser una aplicación web, tiene las siguientes características:

• Mayor rendimiento que una aplicación web al uso, pudiendo cargarse prácticamente de forma instantánea
• Uso de recursos del smartphone o tablet reducido
• Interfaz de usuario muy similar a la de una aplicación nativa
• Posibilita el uso de la aplicación sin conexión
• Permite enviar notificaciones push a los usuarios de la misma forma que lo hacen las aplicaciones nativas.
• Permite anclarla en la pantalla del dispositivo como si fuese una aplicación nativa.
• Su desarrollo es menos costoso y la inversión es menor que si fuese un desarrollo de aplicación nativa.

Las tecnologías empleadas en las aplicaciones web progresivas

Hemos indicado que este tipo de desarrollo utiliza las últimas tecnologías de los navegadores. En concreto, nos referimos a cuatro tecnologías que repasamos a continuación.

Responsive web design

Ya hablamos hace unos meses en un post de la importancia de un diseño web responsive. Pues bien, esta es una de las tecnologías básicas que se utiliza en el desarrollo de este tipo de aplicaciones, de forma que se garantiza una correcta visualización en diferentes dispositivos de diferente tamaño de pantalla.

Service Workers

Esta nueva tecnología de cierta complejidad nos permite ejecutar servicios en segundo plano en los navegadores, con la ventaja que pueden funcionar incluso si la aplicación está cerrada, ya que son independientes de la misma.

Los service workers permiten varias de las características de una aplicación nativa sobre una aplicación web. En concreto, nos va a permitir:

• Interceptar las comunicaciones para gestionarlas
• Cachear la información para mejorar la velocidad de la aplicación
• Descargar contenidos que solicita el usuario en segundo plano
• Permitir que la aplicación pueda estar operativa sin conexión pese a ser una aplicación web.
• Permitir, como ya hemos mencionado, el envío de mensajes push al usuario.

Como podemos intuir, esta es una tecnología de grandes posibilidades, pero de momento deberemos usar Chrome sobre Android para explotarla, aunque en breve seguro que más navegadores la adoptarán.

App Shell

Estamos hablando de nuevas tecnologías, pero App Shell es un patrón de desarrollo de aplicaciones en realidad. Nos va a permitir dividir la aplicación en dos, por un lado, la funcionalidad de la misma y por el otro el contenido y cargar ambas partes por separado

Y esto, ¿para qué sirve? Pues básicamente para mejorar la velocidad de acceso a la aplicación.

Tendremos, por un lado, la aplicación cacheada para poder usarla sin conexión y así también se cargue rápidamente y, por otro lado, el contenido que puede cargarse también de una caché o bien desde la web si hay conexión, pero en paralelo.

Manifiesto de la aplicación

El manifiesto no es más que un archivo (manifest.json) en el que podemos controlar el aspecto que tendrá el icono de una aplicación que queremos anclar en el menú de inicio de Android.

Con este archivo podremos anclar las aplicaciones web progresivas en nuestras pantallas de Android, y para dar una mayor sensación de aplicación nativa, Google hace que aparezca un banner de instalación como si realmente fuese una instalación al uso.

Algunos ejemplos de aplicaciones web progresivas

Ahora que ya sabemos que son y qué tecnologías usan, veamos algunos ejemplos de aplicaciones web progresivas que ya están en el mercado.

Una de las más potentes es la de la famosa tienda on-line AliExpress. Es una aplicación ligera, con un rendimiento muy bueno y que no tiene nada que envidiar a su versión anterior en cuanto a funcionalidad. Twitter también se ha apuntado al carro de las PWA. Ha sacado recientemente esta versión orientada a terminales con pocos recursos para poder funcionar de forma adecuada.