Una aplicación web progresiva ( PWA ), o aplicación web progresiva , [1] es un tipo de software de aplicación entregado a través de la web , creado utilizando tecnologías web comunes que incluyen HTML , CSS , JavaScript y WebAssembly . [2] Está pensado para funcionar en cualquier plataforma con un navegador compatible con los estándares , incluidos dispositivos móviles y de escritorio .
Dado que una aplicación web progresiva es un tipo de página web o sitio web conocido como aplicación web , no requiere paquete ni distribución por separado. Los desarrolladores pueden simplemente publicar la aplicación web en línea, asegurarse de que cumpla con los requisitos básicos de instalación y garantizar que los usuarios podrán agregar la aplicación a su pantalla de inicio . Publicar la aplicación en sistemas de distribución digital como Apple App Store o Google Play es opcional. [3]
A partir de 2021, las funciones de PWA son compatibles en diversos 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 en 2007, Steve Jobs anunció que el iPhone "ejecutaría aplicaciones creadas con los estándares de Internet Web 2.0". [11] No se requería 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 . [12] Este modelo se cambió posteriormente a la App Store , como una forma de apaciguar a los desarrolladores frustrados. [13] En octubre de 2007, Jobs anunció que el año siguiente se lanzaría un SDK. [12] Como resultado, aunque Apple continuó admitiendo aplicaciones web, la gran mayoría de las aplicaciones de iOS se desplazaron hacia la App Store.
A principios de la década de 2010, las páginas web dinámicas permitieron utilizar tecnologías web para crear aplicaciones web interactivas . El diseño web responsivo y la flexibilidad del tamaño de pantalla que proporciona han hecho que el desarrollo de PWA sea más accesible. Las mejoras continuas en HTML, CSS y JavaScript permitieron que las aplicaciones web incorporaran mayores niveles de interactividad, haciendo posibles experiencias nativas en un sitio web. [14]
En 2013, Mozilla lanzó Firefox OS . Estaba destinado a ser un sistema operativo de código abierto para ejecutar aplicaciones web como aplicaciones nativas en dispositivos móviles. Firefox OS se basó en el motor de renderizado Gecko con una interfaz de usuario llamada Gaia, escrita en HTML5. El desarrollo de Firefox OS finalizó en 2016, [15] y el proyecto se suspendió por completo en 2017, [16] aunque se utilizó una bifurcación de Firefox OS como base de KaiOS , una plataforma de teléfonos básicos. [17]
En 2015, la diseñadora Frances Berriman y el ingeniero de Google Chrome Alex Russell acuñaron el término "aplicaciones web progresivas" [18] para describir las aplicaciones que aprovechan las nuevas funciones admitidas por 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 (SO) nativo. Luego, Google hizo importantes esfuerzos para promover el desarrollo de PWA para Android. [19] [20] Firefox introdujo soporte para trabajadores de servicios en 2016, y Microsoft Edge y Apple Safari siguieron en 2018, [21] [19] 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 [7] (en Windows ) y Google Chrome [22] (en Windows, macOS , ChromeOS y Linux ).
En diciembre de 2020, Firefox para escritorio abandonó la implementación de PWA (específicamente, eliminó el prototipo de configuración de " navegador específico del sitio " que había estado disponible como característica experimental). Un arquitecto de Firefox señaló: "La señal que espero que estemos enviando es que la compatibilidad con PWA no llegará pronto al escritorio de Firefox". [6] Mozilla todavía planea admitir PWA en Android. [23]
Dado que una aplicación web progresiva es un tipo de página web o sitio web conocido como aplicación web , no requiere paquete ni distribución por separado. En particular, no existe ningún requisito para que los desarrolladores o usuarios instalen aplicaciones web a través de sistemas de distribución digital como Apple App Store , Google Play , Microsoft Store o Samsung Galaxy Store . En diversos grados, las principales tiendas de aplicaciones apoyan la publicación de PWA. [3] Google Play, Microsoft Store, [24] y Samsung Galaxy Store admiten PWA, pero Apple App Store no. Microsoft Store publica algunas PWA calificadas automáticamente (incluso sin las solicitudes de los autores de la aplicación) después de descubrirlas a través de la indexación de Bing . [25]
Todas 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 más fácilmente que con aplicaciones nativas. [19] 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. [26] En este modelo, los trabajadores de servicios almacenan la interfaz de usuario básica o " shell " de la aplicación web de diseño web responsivo en la caché fuera de línea 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 el contenido se puede cargar de forma progresiva y dinámica. [27]
Russell describió los criterios técnicos básicos para que un sitio sea considerado una aplicación web progresiva y, por lo tanto, capaz de ser instalado por navegadores en una publicación de seguimiento [28] y los actualizó desde: [29] [30]
nameo short_name, start_urly 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 puedan descubrir y alivia los complejos procedimientos de instalación (pero las PWA aún figuran en una tienda de aplicaciones de terceros ). [32] Además, las PWA admiten interacciones y navegación nativas al estilo de las aplicaciones, incluida la adición a la pantalla de inicio , la visualización de pantallas de presentación , etc.En 2017, Twitter lanzó Twitter Lite, una PWA alternativa a las aplicaciones nativas oficiales de Android e iOS . Según Twitter, Twitter Lite consumía sólo entre el 1 y el 3% del tamaño de las aplicaciones nativas. [33] Starbucks proporciona una PWA que es un 99,84% más pequeña que su aplicación iOS equivalente. Después de implementar su PWA, Starbucks duplicó el número de pedidos en línea, y los usuarios de computadoras de escritorio realizaron pedidos aproximadamente al mismo ritmo que los usuarios de aplicaciones móviles. [34]
Una revisión de 2018 publicada por Forbes encontró que los usuarios de la PWA de Pinterest pasaban un 40% más de tiempo en el sitio en comparación con el sitio web móvil anterior. Las tasas de ingresos publicitarios también aumentaron un 44% y las interacciones principales un 60%. [35] Flipkart vio que el 60% de los clientes que habían desinstalado su aplicación nativa volvieron a usar Flipkart PWA. Lancôme experimentó una disminución del 84 % en el tiempo hasta que la página sea interactiva, lo que generó un aumento del 17 % en las conversiones y un aumento del 53 % en las sesiones móviles en iOS con su PWA. [36]
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 agregarse a la pantalla de inicio del dispositivo. Para cumplir con esta definición, todas las PWA requieren como mínimo un trabajador de servicio y un manifiesto. [37] [38] [39]
El manifiesto de la aplicación web [40] es una especificación del W3C que define un manifiesto basado en JSON (normalmente denominado manifest.json) [32] para proporcionar a los desarrolladores un lugar centralizado para colocar los metadatos asociados con una aplicación web, que incluye:
Estos metadatos son cruciales para que una aplicación se agregue a una pantalla de inicio o se incluya junto con las aplicaciones nativas.
iOS Safari implementa parcialmente manifiestos, mientras que la mayoría de los metadatos de PWA se pueden definir mediante extensiones específicas de Apple para las metaetiquetas. Estas etiquetas permiten a los desarrolladores habilitar la visualización en pantalla completa, definir iconos y pantallas de presentación y especificar un nombre para la aplicación. [41] [42]
WebAssembly permite ejecutar código precompilado en un navegador web, a una velocidad casi nativa. [43] Por lo tanto, las bibliotecas escritas en lenguajes como C se pueden agregar a las aplicaciones web. Anunciado en 2015 y lanzado por primera vez en marzo de 2017, WebAssembly se convirtió en una recomendación del World Wide Web Consortium el 5 de diciembre de 2019 [44] [45] [46] y recibió el Premio de Software de Lenguajes de Programación de ACM SIGPLAN en 2021. [47]
Los contextos de ejecución de las aplicaciones web progresivas se descargan siempre que sea posible, por lo que las aplicaciones web progresivas deben almacenar la mayor parte de su estado interno a largo plazo (datos de usuario, recursos de aplicaciones cargados dinámicamente) de una de las siguientes maneras:
Web Storage es una API estándar del W3C que permite el almacenamiento de valores-clave en navegadores modernos. La API consta de dos objetos, sessionStorage (que permite el almacenamiento solo de sesión que se borra al finalizar la sesión del navegador) y localStorage (que permite el almacenamiento que persiste entre sesiones). [48]
La API de base de datos indexada es una API de base de datos estándar del W3C disponible en los principales navegadores. La API es compatible con los navegadores modernos y permite el almacenamiento de objetos JSON y cualquier estructura representable como una cadena. [49] La API de base de datos indexada se puede utilizar con una biblioteca contenedora que proporciona construcciones adicionales a su alrededor.
Un trabajador de servicio es un trabajador web que implementa un proxy de red programable que puede responder a solicitudes web/HTTP desde el documento principal. Puede verificar la disponibilidad de un servidor remoto, almacenar en caché el contenido cuando ese servidor esté disponible y servir ese contenido más adelante en el documento. Los trabajadores de servicios, como cualquier otro trabajador web, trabajan por separado del contexto del documento principal. Los trabajadores del servicio pueden manejar notificaciones automáticas 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. [50]
Los trabajadores del servicio pasan por un ciclo de vida de tres pasos: registro, instalación y activación. El registro implica indicarle al navegador la ubicación del trabajador del servicio en preparación para la instalación. La instalación se produce cuando no hay ningún trabajador de servicio instalado en el navegador de la aplicación web o si hay una actualización del trabajador de servicio. La activación ocurre cuando todas las páginas de la PWA están cerradas, para que no haya 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 trabajador de servicio, ya que solo un trabajador de servicio puede estar activo para un dominio. [50]
Que yo sepa, no tenemos planes de desactivar las PWA en dispositivos móviles.
{{cite web}}: Mantenimiento CS1: nombres numéricos: lista de autores ( enlace )