Una aplicación web progresiva ( PWA ), o aplicación web progresiva , es un tipo de aplicación web que se puede instalar en un dispositivo como una aplicación independiente . [1] Las PWA se instalan utilizando el caché sin conexión del navegador web del dispositivo . [2]
Las PWA se introdujeron en 2016 como una alternativa a las aplicaciones nativas (específicas del dispositivo), con la ventaja de que no requieren una distribución o empaquetamiento por separado para diferentes plataformas. Se pueden utilizar en una variedad de sistemas diferentes, incluidos los dispositivos móviles y de escritorio . La publicación de la aplicación en sistemas de distribución digital como Apple App Store o Google Play es opcional. [2]
Debido a que una PWA se entrega en forma de una página web o sitio web creado con tecnologías web comunes, como HTML , CSS , JavaScript y WebAssembly , [3] puede funcionar en cualquier plataforma con un navegador compatible con PWA. A partir de 2021, las funciones de PWA son compatibles en distintos grados con Google Chrome , Apple Safari , Firefox para Android y Microsoft Edge [4] [5], pero no con Firefox para escritorio. [6]
En la Conferencia Mundial de Desarrolladores de Apple de 2007, Steve Jobs anunció que el iPhone "ejecutaría aplicaciones creadas con estándares de Internet Web 2.0". [7] No se requirió ningún kit de desarrollo de software (SDK), y las aplicaciones se integrarían completamente en el dispositivo a través del motor del navegador Safari . [8] Este modelo se trasladó más tarde a la App Store , como un medio para apaciguar a los desarrolladores frustrados. [9] En octubre de 2007, Jobs anunció que se lanzaría un SDK al año siguiente. [8] Como resultado, aunque Apple continuó dando soporte a las aplicaciones web, la gran mayoría de las aplicaciones de iOS se trasladaron a la App Store.
A principios de la década de 2010, las páginas web dinámicas permitieron que se utilizaran tecnologías web para crear aplicaciones web interactivas . El diseño web adaptable y la flexibilidad del tamaño de pantalla que proporciona han hecho que el desarrollo de PWA sea más accesible. Las mejoras continuas de HTML, CSS y JavaScript permitieron que las aplicaciones web incorporaran mayores niveles de interactividad, lo que hizo posible experiencias similares a las nativas en un sitio web. [10]
En 2013, Mozilla lanzó Firefox OS . Su objetivo era ser un sistema operativo de código abierto para ejecutar aplicaciones web como aplicaciones nativas en dispositivos móviles. Firefox OS se basaba en el motor de renderizado Gecko con una interfaz de usuario llamada Gaia, escrita en HTML5. El desarrollo de Firefox OS finalizó en 2016, [11] y el proyecto se interrumpió por completo en 2017, [12] aunque se utilizó una bifurcación de Firefox OS como base de KaiOS , una plataforma de teléfonos con funciones. [13]
En 2015, la diseñadora Frances Berriman y el ingeniero de Google Chrome Alex Russell acuñaron el término "aplicaciones web progresivas" [14] para describir las aplicaciones que aprovechan las nuevas funciones compatibles con los navegadores modernos, incluidos los trabajadores de servicios y los manifiestos de aplicaciones web , que permiten a los usuarios actualizar las aplicaciones web a aplicaciones web progresivas en su sistema operativo (OS) nativo. Luego, Google realizó importantes esfuerzos para promover el desarrollo de PWA para Android. [15] [16] Firefox introdujo soporte para trabajadores de servicios en 2016, y Microsoft Edge y Apple Safari lo siguieron en 2018, [17] [15] haciendo que los trabajadores de servicios estén disponibles en todos los sistemas principales.
En 2019, las PWA eran compatibles con las versiones de escritorio de la mayoría de los navegadores, incluidos Microsoft Edge [18] (en Windows ) y Google Chrome [19] (en Windows, macOS , ChromeOS y Linux ).
En diciembre de 2020, Firefox para escritorio abandonó la implementación de PWA (específicamente, eliminó la configuración del prototipo de " navegador específico del sitio " que había estado disponible como una función experimental). Un arquitecto de Firefox señaló: "La señal que espero que estemos enviando es que la compatibilidad con PWA no llegará pronto a Firefox para escritorio". [6] Mozilla aún planea admitir PWA en Android. [20]
Las aplicaciones web progresivas están diseñadas para funcionar en cualquier navegador que cumpla con los estándares web apropiados . Al igual que con otras soluciones multiplataforma, el objetivo es ayudar a los desarrolladores a crear aplicaciones multiplataforma con mayor facilidad que con las aplicaciones nativas. [15] Las aplicaciones web progresivas emplean la estrategia de desarrollo web de mejora progresiva .
Algunas aplicaciones web progresivas utilizan un enfoque arquitectónico llamado App Shell Model. [24] En este modelo, los trabajadores de servicio almacenan la interfaz básica de usuario o " shell " de la aplicación web de diseño web responsivo en la memoria caché sin conexión del navegador . Este modelo permite que las PWA mantengan un uso similar al nativo con o sin conectividad web. Esto puede mejorar el tiempo de carga, al proporcionar un marco estático inicial , un diseño o arquitectura en el que se puede cargar el contenido de forma progresiva y dinámica. [25]
Los criterios técnicos básicos para que un sitio se considere una aplicación web progresiva y, por lo tanto, pueda ser instalada por los navegadores fueron descritos por Russell en 2016 [26] y actualizados desde entonces: [27] [28]
nameo short_name, start_url, y display(con un valor de standalone, fullscreeno minimal-ui), y icons(con versiones de 192 px y 512 px). La información contenida en el manifiesto hace que las PWA se puedan compartir fácilmente a través de una URL, que los motores de búsqueda las detecten y alivia los procedimientos de instalación complejos (pero las PWA aún pueden aparecer en una tienda de aplicaciones de terceros ). [30] Además, las PWA admiten interacciones y navegación nativas de estilo de aplicación, incluida la adición a la pantalla de inicio , la visualización de pantallas de presentación , etc.Existen muchas tecnologías que se utilizan comúnmente para crear aplicaciones web progresivas. Una aplicación web se considera una PWA si cumple con los criterios de instalación, por lo que puede funcionar sin conexión y se puede agregar a la pantalla de inicio del dispositivo. Para cumplir con esta definición, todas las PWA requieren como mínimo un manifiesto y un service worker. [31] [32] [33] Se pueden utilizar otras tecnologías para almacenar datos, comunicarse con servidores o ejecutar código.
El manifiesto de la aplicación web [34] es una especificación del Consorcio World Wide Web (W3C) que define un manifiesto basado en JSON (normalmente denominado manifest.json) [30] para proporcionar a los desarrolladores un lugar centralizado donde colocar metadatos asociados con una aplicación web, incluidos:
Estos metadatos son cruciales para que una aplicación se agregue a una pantalla de inicio o aparezca junto a las aplicaciones nativas.
Safari para iOS implementa parcialmente los manifiestos, mientras que la mayoría de los metadatos de la PWA se pueden definir a través de extensiones específicas de Apple para las metaetiquetas. Estas etiquetas permiten a los desarrolladores habilitar la visualización en pantalla completa, definir íconos y pantallas de presentación y especificar un nombre para la aplicación. [35] [36]
Un service worker es un web worker que implementa un proxy de red programable que puede responder a solicitudes web/HTTP del documento principal. Es capaz de comprobar la disponibilidad de un servidor remoto, almacenar en caché el contenido cuando ese servidor está disponible y servir ese contenido más tarde al documento. Los service workers, como cualquier otro web worker, trabajan independientemente del contexto del documento principal. Los service workers pueden manejar notificaciones push y sincronizar datos en segundo plano, almacenar en caché o recuperar solicitudes de recursos, interceptar solicitudes de red y recibir actualizaciones centralizadas independientemente del documento que las registró, incluso cuando ese documento no está cargado. [37]
Los service workers pasan por un ciclo de vida de tres pasos: registro, instalación y activación. El registro implica indicar al navegador la ubicación del service worker en preparación para la instalación. La instalación se produce cuando no hay ningún service worker instalado en el navegador para la aplicación web o si hay una actualización del service worker. La activación se produce cuando se cierran todas las páginas de la PWA, de modo que no haya ningún conflicto entre la versión anterior y la actualizada. El ciclo de vida también ayuda a mantener la coherencia al cambiar entre versiones de un service worker, ya que solo un único service worker puede estar activo para un dominio. [37]
WebAssembly permite ejecutar código precompilado en un navegador web a una velocidad casi nativa. [38] De esta forma, se pueden añadir bibliotecas escritas en lenguajes como C a las aplicaciones web. Anunciado en 2015 y lanzado por primera vez en marzo de 2017, WebAssembly se convirtió en una recomendación del W3C el 5 de diciembre de 2019 [39] [40] [41] y recibió el premio al mejor software de lenguajes de programación de ACM SIGPLAN en 2021. [42]
Los contextos de ejecución de aplicaciones web progresivas se descargan siempre que sea posible, por lo que las aplicaciones web progresivas necesitan almacenar la mayor parte de su estado interno a largo plazo (datos del usuario, recursos de la aplicación cargados dinámicamente) de una de las siguientes maneras:
En 2017, Twitter lanzó Twitter Lite, una alternativa de PWA a las aplicaciones nativas oficiales de Android e iOS . Según Twitter, Twitter Lite consumía solo entre el 1 y el 3 % del tamaño de las aplicaciones nativas. [45] Starbucks ofrece una PWA que es un 99,84 % más pequeña que su aplicación equivalente para iOS. Después de implementar su PWA, Starbucks duplicó la cantidad de pedidos en línea, y los usuarios de computadoras de escritorio realizaron pedidos aproximadamente al mismo ritmo que los usuarios de la aplicación móvil. [46]
Una revisión de 2018 publicada por Forbes descubrió que los usuarios de la PWA de Pinterest pasaron un 40% más de tiempo en el sitio en comparación con el sitio web móvil anterior. Las tasas de ingresos por publicidad también aumentaron en un 44% y las interacciones principales en un 60%. [47] Flipkart vio que el 60% de los clientes que habían desinstalado su aplicación nativa volvieron a usar la PWA de Flipkart. Lancôme vio una disminución del 84% en el tiempo hasta que la página es interactiva, lo que genera un aumento del 17% en las conversiones y un aumento del 53% en las sesiones móviles en iOS con su PWA. [48]
Dado que una PWA no requiere una distribución o empaquetamiento por separado para diferentes plataformas y está disponible para los usuarios a través de la web, no es necesario que los desarrolladores la publiquen en sistemas de distribución digital como Apple App Store , Google Play , Microsoft Store o Samsung Galaxy Store . Las principales tiendas de aplicaciones admiten la publicación de PWA en distintos grados. [2] Google Play, Microsoft Store, [49] y Samsung Galaxy Store admiten PWA, pero Apple App Store no. Microsoft Store publica automáticamente algunas PWA que califican (incluso sin solicitudes de los autores de la aplicación) después de descubrirlas a través de la indexación de Bing . [50]
No tenemos planes de eliminar las PWA en dispositivos móviles, que yo sepa.
{{cite web}}: CS1 maint: nombres numéricos: lista de autores ( enlace )