Nuestra agencia asociada giftGRÜN ha construido una aplicación web progresiva (PWA por sus siglas en inglés) con WordPress para el Hospital Universitario RWTH Aachen en Aquisgrán (Alemania), que apoya la integración de nuevos/as empleados/as. Hablamos con Patrick Heinker sobre las ventajas y desventajas de las PWAs frente a los sitios web y las aplicaciones nativas.
Así funciona una Progressive Web App
Patrick, ¿cómo funciona exactamente una PWA y qué pasa con la gestión de datos?
Los contenidos se mantienen en WordPress y se emiten a través de plantillas estándar. Un ServiceWorker proporciona la funcionalidad offline. Cuando se abre inicialmente el sitio, el ServiceWorker descarga un archivo zip con todas las páginas generado en el lado del servidor.
Cuando se visita una web, se mostrará el sitio que ya está en la memoria caché. El ServiceWorker se encarga de la actualización en segundo plano, de modo que muestra el nuevo contenido en la siguiente visita si algo ha cambiado. Opcionalmente, también podría recargarse después de una actualización, pero eso no ha sido necesario para nuestro caso práctico.
El almacenamiento de datos es completamente offline, sólo para los vídeos y contenidos externos se requiere una conexión a Internet.
PWA vs App nativa
¿Cuáles son las diferencias, pero también las ventajas, en comparación con las aplicaciones nativas?
Las aplicaciones nativas son específicas de acuerdo con la plataforma correspondiente, a menudo complejas y, por tanto, caras de implementar. Además, tienen que distribuirse a través de las tiendas oficiales para conseguir un gran alcance. Las PWAs, en cambio, pueden instalarse directamente al visitar el sitio con solo pulsar un botón.
Sin embargo, Apple todavía está un poco atrasada con el soporte de las funcionalidades PWA, pero el hecho de que Safari no soporte cosas que son comunes en otros navegadores desde hace años no es algo nuevo para los desarrolladores web...
¿Cómo es la interacción entre la aplicación web progresiva (Progressive Web App) con WordPress?
Utilizamos WordPress para el mantenimiento de los datos, pero también para las plantillas. Se trata de un sitio web normal, con la única diferencia de que el contenido está disponible sin conexión a través de un ServiceWorker de JavaScript. Y que se comporta casi como una aplicación nativa.
También existe la posibilidad de utilizar la REST-API de WordPress y renderizar todo del lado del cliente, como sería habitual en las aplicaciones nativas. Sin embargo, para nuestra aplicación solo vimos un esfuerzo adicional aquí que apenas aporta beneficios.
Implementar una aplicación web progresiva con WordPress
¿Cuáles son los enfoques si se quiere implementar una Progressive Web App con WordPress?
Existen algunos plugins, que pueden convertir un sitio en una Progressive Web App con el clic de un botón y unos pocos ajustes. También existen servicios de notificaciones push que pueden utilizarse para informar a todos los visitantes del blog sobre las nuevas publicaciones. Sin embargo, estas páginas web preparadas ( Plugins ) están pensadas más bien para hacer que un blog normal sea apto para el uso fuera de línea y para precargar archivos específicos.
Después de jugar y probar algunos de estos plugins, pasamos a nuestra propia solución. Construimos nuestra funcionalidad separada de plugins para permitir, por ejemplo, la carga completa del contenido de la página a través de un zip generado por el servidor y para ser más flexibles en la personalización de las características. Las notificaciones push se suelen asignar a través de servicios de pago, pero también se pueden crear internamente.
PWAs: compatibilidad y protección de datos
¿Cuáles son las posibles amenazas y cómo las has resuelto? ¿Y qué hay de la política de privacidad sobre la protección de datos?
Lo habitual en el desarrollo web: cada navegador funciona de forma diferente y hay que probarlo exhaustivamente en todos los dispositivos. Apple se niega a apoyar plenamente la funcionalidad PWA y, de nuevo, tiene sus propias etiquetas meta específicas de Apple (no estándar) para hacer que la aplicación funcione.
El modelo de almacenamiento en caché debe ser elegido para adaptarse a cada aplicación. Los ServiceWorkers pueden dar salida a páginas almacenadas en caché en milisegundos y refrescarlas en segundo plano. Sin embargo, si estoy en una página de novedades, el usuario puede preferir ver una pequeña barra de espera hasta que se cargue el último contenido.
La protección de datos fue una de las principales razones para elegir una PWA. Los contenidos y el progreso de aprendizaje de los usuarios se mantienen completamente desconectados. El servidor nunca ve qué usuario llama a qué, ya que no hay usuarios conectados. Por lo tanto, no se puede rastrear si un nuevo/a empleado/a ha consultado algún lugar o si ni siquiera ha instalado la aplicación.
Ventajas y desventajas de los sistemas
¿Cómo se decide por cliente qué tecnología es la más adecuada para un proyecto de este tipo?
Hay aplicaciones que solo pueden implementarse a través de una app nativa. Por ejemplo, si un cliente quiere absolutamente las notificaciones push en un iPhone, entonces no hay otra manera que de forma nativa. Por otro lado, la producción de las PWAs es también significativamente más barata que una app nativa debido al uso de tecnologías web y al hecho de que no es necesario todo el manejo de la tienda. Por supuesto, el presupuesto disponible también juega un papel crucial.
¿Tenéis algún otro proyecto de PWA en marcha del que puedas hablarnos?
Muchas, pero no queremos revelarlas todavía 😉 Sólo esto: también se pueden hacer grandes cosas con las PWA en el sector del comercio electrónico.
¿Algunas palabras sobre ti y tu agencia?
giftGRÜN es la agencia digital del GRÜN Gruppe ("grupo verde", en español). Nuestro grupo de empresas es el proveedor líder del mercado de sistemas de gestión de donaciones y afiliaciones en Alemania. La mayoría de nuestros proyectos consisten en la creación de un sistema completo para nuestros clientes, es decir, la conexión de nuestro sistema ERP con los sitios web.
Hacemos mucho trabajo de interfaz y también desarrollamos nuestros propios temas de WordPress. Nuestro equipo está formado por diseñadores, frontales y backendlers y gestores de proyectos. Nuestro anfitrión favorito es, por supuesto, de Münster 🙂 .
