Últimamente empezamos a oír mucho el término desarrollo de aplicaciones web progresivas. Vamos a explicarte en qué consiste y en qué se diferencian las PWAs (Progressive Web Apps) de una app tradicional.

Si tenemos en cuenta la cantidad de citas que se hacen acerca de esta nueva forma de procesar aplicaciones y el revuelo que están generando deberíamos encontrarnos ante una especie de revolución del mundo app.

¿Forman las PWAs parte de una moda o constituyen el futuro del desarrollo de aplicaciones?

Vamos a intentar darte primero un poco de perspectiva explicando la diferencia entre una aplicación nativa (las aplicaciones clásicas) y una aplicación web.

¿Qué es una aplicación nativa?

Una aplicación nativa es una aplicación que ha sido específicamente desarrollada y diseñada para funcionar en el sistema operativo en el que se descarga, por ejemplo iOS en los iPhone o Android en casi todo el resto de modelos de smartphones.

Ahora bien, no confundas las capas de personalización con el sistema operativo. Muchas marcas como Samsung o Huawei utilizan personalizaciones de Android para hacer sus dispositivos más “auténticos”, pero el sistema operativo sigue siendo Android OS. Lo único que cambia es la apariencia y algunas formas de configuración. ¿Todo bien? Seguimos.

Las aplicaciones nativas deberían funcionar mejor que las aplicaciones web, ya que han sido creadas para correr en el sistema que las descargues y, por lo tanto, su uso debería ofrecer una experiencia más fluida y sin fallos.

La paradójica historia de las aplicaciones web

Las aplicaciones web son anteriores a las aplicaciones de desarrollo nativo. Existe también una tercera vía conocida como desarrollo híbrido. Esta modalidad consiste en utilizar aplicaciones web pensadas para correr en teléfonos móviles que se convierten en nativas a través de algún envoltorio como Apache Cordova.

Aunque a día de hoy cueste creerlo, ya que casi el 100 % de las apps que utilizas en tu smarthpone son nativas, esta no era la idea original.

Cuando iPhone lanzó su primer terminal hace más de una década, abriendo el camino del resto de dispositivos, la línea de planteamiento app consistía en que la mayoría de aplicaciones fueran web y se anclaran a través de un acceso directo a la pantalla de inicio. El desarrollo de apps nativas apareció un año después.

La realidad actual es muy distinta y muy poca gente utiliza aplicaciones web ancladas a la pantalla principal. Entre las razones que han llevado a este escenario se encuentran:

– Una menor agilidad por parte de las aplicaciones web.

– Sus capacidades carecen de muchas funciones que sí poseen las apps nativas: envío de notificaciones, funcionamiento sin conexión o almacenamiento local de datos.

El “pero” es que todas estas diferencias se pueden subsanar y, de hecho, la industria del software está trabajando para salvarlas.

¿Qué es una PWA o aplicación web progresiva?

PWASegún define Google en su sección dedicada especialmente a este tema, una PWA utiliza tecnología punta de los navegadores para ofrecer una experiencia móvil igual al que ofrece una app nativa, con la ventaja de que no tienes que descargar ningún contenido en tu dispositivo. La multinacional californiana quiere apostar por este tipo de aplicaciones que quedaron en el olvido bajo las siguientes premisas:

– Que las PAWs tengan el mayor rendimiento posible con carga instantánea.

– Un aspecto e interfaz lo más similar posible al de una app nativa.

– Que dispongan de modo off-line.

– Que sean capaces de enviar notificaciones.

De hecho, si utilizas un dispositivo con Android actualizado a su última versión, podrás comprobar al acceder a facebook a través del navegador (chrome) que muchas de estas premisas se cumplen. El rendimiento, el aspecto y el envío de notificaciones es prácticamente idéntico a la aplicación oficial (nativa) que puede descargarse desde la app store de Google.

Sin duda es una buena decisión utilizar facebook a través del navegador, ya que es extensamente conocido que la app nativa de facebook ocupa mucho espacio en tu dispositivo, además de ralentizar su funcionamiento y consumir una gran cantidad de datos móviles.

Tecnologías que aprovechan las PWA

Para lograr este rendimiento las PWAs se basan en los siguientes conceptos:

  1. Responsive Web Design, animaciones CSS y frameworks específicos.
  2. Service Workers.
  3. App Shell.
  4. Manifiesto de aplicación.

Teniendo en cuenta que el primer punto hace referencia al hecho de aplicar efectos para conseguir un diseño de sitio web y aspecto visual y efectivo, vamos a centrarnos en los puntos 2, 3 y 4 que se centran en los apartados más técnicos.

Service Workers

Constituyen una tecnología muy interesante, a la par que compleja, orientada a ejecutar servicios en segundo plano cuando utilizas un navegador.

Un Web Worker te permite ejecutar código pesado en segundo plano mientras utilizas un navegador para que la interfaz no se bloquee y puedas seguir trabajando con ella.

Los Service Workers van un paso más allá y ejecutan tareas de forma independiente. De esta forma, aunque hayas cerrado la aplicación del navegador, seguirá trabajando con capacidades avanzadas como el envío de notificaciones, la descarga de contenidos en segundo plano o el cacheado de la información.

En realidad, las funcionalidades que ofrecen los Service Workers ni siquiera serían necesarias para el funcionamiento de muchas apps. Sin embargo, su desarrollo es un precedente para el futuro de apps más ambiciosas.

Actualmente, y como te comentábamos un poco antes, los únicos navegadores que permiten el uso de Service Workers son Chrome y Firefox (en su versión de escritorio, PC). En el caso de los móviles, el único navegador capaz de soportar esta tecnología es Chrome v.51.

Si querías que la PWA funcionase igualmente en iOS, Windows Phone o teléfonos Android algo antiguos, sentimos comunicarte que todavía no está disponible.

App Shell

app web progresivaNo constituye una tecnología en sí misma, sino un patrón para separar las funcionalidades del contenido y cargarlos de forma separada.

Lo idóneo consiste en que las aplicaciones se encuentren cacheadas para usar fuera de línea (cargando rápidamente la interfaz y los elementos visuales fijos) y que el contenido (fotos, vídeos, documentos, etc) se carguen aparte (bien utilizando un caché inicial o a través de la web cuando haya conexión).

El App Shell ayudaría por tanto a un proceso de carga veloz, la piedra angular de toda aplicación debido a la impaciencia que nos caracteriza como seres humanos.

Manifiesto de aplicación

Es la última parte de la cadena que consolida el desarrollo de las PWAs.

Como os explicamos al inicio de este artículo, desde el inicio de la era smartphone puedes anclar una página web concreta del navegador al menú inicio para acceder directamente a ella (como si fuese una aplicación normal y corriente).

Para definir el aspecto visual del icono resultante cada navegador y sistema operativo utiliza técnicas diferentes.

En iOs y Windows Phone se utilizan cabeceras “meta” que se añaden a la pantalla principal. En Chrome para Android, y solo para Android, se usa un archivo llamado “Manifiesto” que está operativo desde la v.38 de 2014.

Ventajas de las Progressive Web Aplications

Instalación

La ventaja principal es que no necesitan ser instaladas. Así se elimina la necesidad de utilizar espacio de almacenamiento en nuestro dispositivo. Quizás en un ordenador no sea un problema, pero desde luego estamos convencidos que en tu smartphone sí lo es. Son ya muchos los usuarios cansados de verse obligados a borrar apps nativas por problemas de memoria.

El único punto negativo sería la necesidad de estar conectado constantemente. Sin embargo, este problema existe también con las apps nativas, ya que son incontables las aplicaciones que no cargan contenido nuevo sin conexión a Internet. De ser una desventaja, desde luego no lo es con respecto a las aplicaciones nativas.

Mayor velocidad

Las PAWs no dependen de la potencia o modelo de tu teléfono para cargar o no de forma rápida. Por ello permiten velocidades de carga mayores solo en función de la velocidad de tu conexión a Internet.

Notificaciones

Posibilidad de recibir notificaciones push directamente a tu smartphone.

Aspecto visual

En cuanto al aspecto, se está ya desarrollando un modo a pantalla completa (desapareciendo los bordes del navegador), de forma que su aspecto sería idéntico al de una app nativa.

Versatilidad

Las aplicaciones web progresivas podrán utilizarse sobre cualquier sistema operativo, sencillamente, abriendo el navegador.

Capacidad de actualización

La versión de las PWAs es siempre la más actual, lo cual no sucede con las app nativas.

¿Son mejores las aplicaciones web progresivas?

En los últimos meses el hipe acerca de las PWAs ha crecido mucho. Sin embargo, ten claro que no es para nada un concepto nuevo, sino que su recorrido tiene ya más de una década, aunque quizás su despegue está por empezar. Algunas cosas se cuecen siempre a fuego lento.

Sin duda, en el plano corporativo, la tendencia empieza a inclinar la balanza hacia el uso de las PWAs, ya que se rumorea que en Microsoft las apps nativas tienen los días contados. En el caso de Google, con su pequeño gran androide, también quiere seguir por el camino de las aplicaciones web.

La última palabra, como siempre, la tienes tú, el usuario.

¿Quieres recibir artículos como este?