iOS abre sus puertas a las Progressive Web Apps
Escrito por Muriel Santoni el
Gran noticia para todos los que ya se orientaron hacia las Progressive Web Apps, y para los que todavía lo están pensando.
Ya conoces todo el potencial de las Progressive Web Apps, estas aplicaciones web que ofrecen funcionalidades nuevas en los navegadores, y cuyo comportamiento y experiencia son comparables a las de las apps nativas.
Si las Progressive Web Apps están ganando terreno desde el año pasado, su principal freno era la ausencia de ciertas funcionalidades claves en los dispositivos iOS.
Ya conoces todo el potencial de las Progressive Web Apps, estas aplicaciones web que ofrecen funcionalidades nuevas en los navegadores, y cuyo comportamiento y experiencia son comparables a las de las apps nativas.
Si las Progressive Web Apps están ganando terreno desde el año pasado, su principal freno era la ausencia de ciertas funcionalidades claves en los dispositivos iOS.
Te presentamos en un artículo previo la piedra angular de las Progressive Web Apps, o sea un elemento clave que les permite proponer tal experiencia de usuario: los Service Workers. Representan la base técnica que distingue las PWAs de las páginas web clásicas.
Este script, ejecutado en el fondo del navegador, ofrece numerosas posibilidades de desarrollo, permitiendo de modificar considerablemente el comportamiento de una app. Sin los Service Workers, es imposible para las Progressive Web Apps de cumplir con el conjunto de sus promesas, lo que explica el freno representado por la incompatibilidad entre los Service Workers e iOS.
Con la actualización iOS 11.3, Apple parece oficialmente lanzarse en el mundo de las Progressive Web Apps, ya que, y lo habrás entendido, ¡los Service Workers ahora están disponible para iOS!
Este script, ejecutado en el fondo del navegador, ofrece numerosas posibilidades de desarrollo, permitiendo de modificar considerablemente el comportamiento de una app. Sin los Service Workers, es imposible para las Progressive Web Apps de cumplir con el conjunto de sus promesas, lo que explica el freno representado por la incompatibilidad entre los Service Workers e iOS.
Con la actualización iOS 11.3, Apple parece oficialmente lanzarse en el mundo de las Progressive Web Apps, ya que, y lo habrás entendido, ¡los Service Workers ahora están disponible para iOS!
¿Cuáles son las funcionalidades disponibles para iOS gracias a los Service Workers?
Desde la actualización iOS 11.3, somos más que contentos anunciar que los usuarios de tu PWA, bajo iOS, ahora pueden gozar de las funcionalidades siguientes:
- Funcionamiento fuera de línea
- Corrección de un bug durante el uso de la cámara
Estas funcionalidades están disponibles si la PWA está ejecutada en Safari, o directamente desde la pantalla de inicio del dispositivo (modo full screen).
Los Service Workers no están asumidos por las Web Views, es decir por los otros navegadores que Safari (en Chrome iOS o en el navegador integrado de Facebook por ejemplo).
Los Service Workers no están asumidos por las Web Views, es decir por los otros navegadores que Safari (en Chrome iOS o en el navegador integrado de Facebook por ejemplo).
Ya tengo una PWA, ¿cómo puedo aprovechar de estas nuevas funcionalidades?
De tu lado, tienes que asegurarte que la fecha de generación de tu PWA es posterior al 6 de Abril. Para verificarlo, vete al menú Publicación > Actualización > Motor de la Progressive Web App. Re-lanza la generación de tu PWA si la fecha indicada es anterior al 6 de Abril.
Del lado de tus usuarios, sus dispositivos tienen que funcionar con iOS 11.3 (o con una versión ulterior). Una vez la actualización iOS 11.3 instalada, tu PWA beneficiará de todas las ventajas aportadas por el uso de los Service Workers.
Del lado de tus usuarios, sus dispositivos tienen que funcionar con iOS 11.3 (o con una versión ulterior). Una vez la actualización iOS 11.3 instalada, tu PWA beneficiará de todas las ventajas aportadas por el uso de los Service Workers.
¿Hay algunas diferencias entre las PWAs en Android y en iOS?
A pesar del enorme paso adelante que representa esta actualización para iOS, existen varias diferencias en el funcionamiento de las PWAs en iOS y Android. Aquí tienes las mayores diferencias de funcionamiento entre los dos OS:
- Gestión del caché: el funcionamiento fuera de línea de las PWAs está permitido gracias a un sistema de gestión del caché. En iOS, el almacenamiento de los datos está limitado a 50Mo, y no en Android.
En Android, los archivos almacenados se suprimen si el espacio de almacenamiento está saturado. En iOS, en cambio, si la PWA no está solicitada por el usuario durante varias semanas, los archivos en caché están suprimidos. Los datos se descargan de nuevo cuando se abre la PWA.
- Sincronización en el fondo: está posible en Android, no en iOS.
- Notificaciones push: todavía no están asumidas en iOS. Apple sigue siendo muy silencioso a propósito de la eventual disponibilidad de las notificaciones push en Safari. De todos modos, de momento, no está posible con iOS 11.3.
- En Android, las PWAs pueden acceder al Bluetooth, lo que no es el caso en iOS.
- Gestión del caché: el funcionamiento fuera de línea de las PWAs está permitido gracias a un sistema de gestión del caché. En iOS, el almacenamiento de los datos está limitado a 50Mo, y no en Android.
En Android, los archivos almacenados se suprimen si el espacio de almacenamiento está saturado. En iOS, en cambio, si la PWA no está solicitada por el usuario durante varias semanas, los archivos en caché están suprimidos. Los datos se descargan de nuevo cuando se abre la PWA.
- Sincronización en el fondo: está posible en Android, no en iOS.
- Notificaciones push: todavía no están asumidas en iOS. Apple sigue siendo muy silencioso a propósito de la eventual disponibilidad de las notificaciones push en Safari. De todos modos, de momento, no está posible con iOS 11.3.
- En Android, las PWAs pueden acceder al Bluetooth, lo que no es el caso en iOS.
¿Aportarán las próximas actualizaciones de iOS nuevas funcionalidades?
Por el momento, desarrollos favorables a las PWAs están en curso por Apple.
De hecho, después de los Service Workers, parece que Apple trabaja ahora sobre el soporte del Web App Manifest por su navegador. Se trata de un componente mayor de las PWAs. Este archivo descriptivo permite definir los elementos utilizados cuando la PWA funciona en el modo full screen, tal como lo define el W3C. La toma en cuenta del Web App Manifest en Safari permitiría por ejemplo:
De hecho, después de los Service Workers, parece que Apple trabaja ahora sobre el soporte del Web App Manifest por su navegador. Se trata de un componente mayor de las PWAs. Este archivo descriptivo permite definir los elementos utilizados cuando la PWA funciona en el modo full screen, tal como lo define el W3C. La toma en cuenta del Web App Manifest en Safari permitiría por ejemplo:
- Forzar la orientación de la pantalla cuando se utiliza la PWA en el modo full screen (es decir, cuando está lanzada desde su icono en la pantalla de inicio).
- Integrar en Safari un sistema invitando el usuario a instalar la PWA en su pantalla de inicio (en Android, una pop-up aparece automáticamente). El Web App Manifest contiene todos los elementos permitiendo a los equipos de Webkit de construir un componente de este tipo.
- Construir una pantalla de lanzamiento para la PWA. En Android, esta pantalla está construida a partir del icono de la app, de su nombre y de un color del fondo. Estos elementos están descritos en el manifiesto.
¿Cómo instalar mi PWA en la pantalla de inicio?
Es posible instalar una PWA en la pantalla de inicio de tu dispositivo iOS. Sin embargo, es el usuario quien tiene que realizar el primer paso ya que ningún mensaje de invitación aparece automáticamente.
Aquí tienes las etapas para instalar una PWA en una pantalla de inicio:
1. Accede a la PWA a través de su URL desde Safari
2. Haz clic sobre el botón de compartir en Safari
3. Haz clic sobre “Añadir a la pantalla de inicio”
4. Verifica que el nombre que aparece en la pantalla de inicio te conviene. Modifícalo si necesario y haz clic sobre “Añadir”.
Aquí tienes las etapas para instalar una PWA en una pantalla de inicio:
1. Accede a la PWA a través de su URL desde Safari
2. Haz clic sobre el botón de compartir en Safari
3. Haz clic sobre “Añadir a la pantalla de inicio”
4. Verifica que el nombre que aparece en la pantalla de inicio te conviene. Modifícalo si necesario y haz clic sobre “Añadir”.
¿Porqué la actualización iOS 11.3 es una oportunidad para tí?
Si ya estaban funcional en iOS, las Progressive Web Apps ahora están en proceso de funcionar plenamente en los dispositivos del gran Apple. El soporte de los Service Workers y los desarrollos en curso del Web App Manifest dan buena esperanza para
El seguimiento de la historia entre Apple y las PWAs.
Una de las ventajas ineludibles de las Progressive Web Apps es su accesibilidad. Siendo ejecutadas en la Web, se acceden a través de una simple URL, están referenciadas por los motores de búsqueda y, sobre todo, una vez instalada en la pantalla de inicio, se utilizan como cualquier otra app.
Los dos primeros puntos son más que positivos para el aumento de tu visibilidad. El último es, de hecho, capital. Un nuevo canal de distribución, diferente de la App Store, se ofrece a ti. La World Wide Web, abierta y libre.
El seguimiento de la historia entre Apple y las PWAs.
Una de las ventajas ineludibles de las Progressive Web Apps es su accesibilidad. Siendo ejecutadas en la Web, se acceden a través de una simple URL, están referenciadas por los motores de búsqueda y, sobre todo, una vez instalada en la pantalla de inicio, se utilizan como cualquier otra app.
Los dos primeros puntos son más que positivos para el aumento de tu visibilidad. El último es, de hecho, capital. Un nuevo canal de distribución, diferente de la App Store, se ofrece a ti. La World Wide Web, abierta y libre.