Progressive Web Apps

De Wikipedia, la enciclopedia libre
Ir a la navegación Ir a la búsqueda

Qué son las Progressive Web Applications o PWA[editar]

Su traducción literal al español sería: Aplicaciones Web Progresivas, aunque ésta traducción no desvela un significado muy concreto ya que, realmente, las Progressive Web Applications o PWA (Abreviación de su significado), son la evolución de las páginas webs hacia un ecosistema tecnológico más cercano al de una aplicación móvil o de escritorio instalable en el sistema operativo.


Requisitos a cumplimentar por una PWA[editar]

Una página web se convierte o se considera PWA cuando cumple una serie de requisitos mínimos con los que conseguir, por ejemplo:

  • que pueda ser instalada de forma fácil en nuestro ordenador, móvil o tablet, tal como si se tratase de una aplicación de escritorio o aplicación móvil
  • conseguir que dicha web proporcione un contenido mínimo cuando nuestro dispositivo no tenga acceso a internet
  • mejorar la experiencia de usuario (UX) con sistemas de cache local inteligente o con carga dinámica de contenido y librerías


Tecnologías con las que se construye una PWA[editar]

Una Progressive Web App es creada usualmente con la tecnología básica que conforma cualquier aplicación web: HTML5, CSS, y JavaScript. Esta tecnología básica, es utilizada ya sea de forma convencional escribiendo el HTML, desarrollando hojas de estilo personalizadas con CSS y utilizando JavaScript para un manejo más profundo de funcionalidades como ser:

  • despliegue de un menú
  • generar animaciones gráficas
  • obtener datos de una base de datos remota para visualizar los mismos en pantalla
  • manejo de almacenamiento local y bases de datos locales
  • acceder a sensores de computadoras y dispositivos móviles

entre otras tantas funciones...


Algunas otras tecnologías utilizadas para la construcción de una PWA, pueden ser:

Muchas de estas últimas tecnologías mencionadas, simplifican la construcción del frontend de una aplicación, y ayudan a integrar más fácilmente los datos a visualizar con el backend de almacenamiento de éstos.

Historia del nacimiento de las progressive web apps[editar]

El nacimiento de las progressive web apps se remontan prácticamente a la llegada del primer iPhone (año 2007) al mercado móvil. Cuando Apple lanzó este dispositivo a la venta mundial, aún no contaban con una Tienda oficial de aplicaciones como es actualmente iTunes. Por lo cual, en ese momento, Apple realizó un convenio con algunas empresas que ya tenían presencia en el mercado móvil, y co-desarrolló con éstas algunas aplicaciones móviles básicas para que estén disponibles en su teléfono móvil estrella.

En paralelo, organizó un concurso de desarrollo de la tecnología JavaScript en teléfonos móviles ya que, la estrella de aquel momento en el universo web (Flash) no tendría su segmento dedicado dentro del ecosistema iPhone, y como resultado de dicho concurso nacieron grandiosos proyectos como Phonegap.

Para suplir en aquel entonces la falta de aplicaciones nativas para iOS (iTunes Store y XCode framework para iOS llegarían al mercado recién en 2008), El navegador web Safari, en su versión para iOS, incluyó una serie de metatags para instalar un icono y acceso directo hacia una web en el escritorio de iOS, pudiendo mostrar el mismo con una pantalla de inicio personalizada, y sin el framework y controles propios de Safari browser.

En aquel momento, el navegador web de Blackberry 10, era otro de los pocos navegadores web que daban soporte nativo a la instalación y visualización de aplicaciones web tal como si fuesen aplicaciones nativas.

Con el tiempo, Android, a partir de su versión 4.0, comenzó a soportar a Google Chrome como navegador web móvil, y así permitió a través de éste, poder instalar aplicaciones web tal como si se tratase de una aplicación nativa en Android. Aunque esto último sólo permitía agregar el ícono en el escritorio de Android.


Con el tiempo, la integración de PWA, llegó a todas las plataformas: iOS, Android, Windows, macOS, Linux, etcétera.


Comunidades[editar]

PWA Experts I/O: https://pwaexperts.io/