Pasar al contenido principal

🔥 Hoy comenzamos la especialidad en programación backend con PHP con Yesi Days ¡La primera clase es en vivo y gratis! 😍 Reserva tu lugar. Comienza en:

Alexys Lozada
José Luján
Manuel Rodriguez
José Luján
Luis Avilés
Álvaro Felipe
José Luján
Beto Quiroga
Jonathan MirCha
Jonathan MirCha
Álvaro Felipe
Alexys Lozada, Álvaro Felipe, Jonathan MirCha
Beto Quiroga
Alexys Lozada
Alexys Lozada
José Luján
Álvaro Felipe
Álvaro Felipe
Jonathan MirCha
Jonathan MirCha
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Alexys Lozada, José Luján
Camilo Adobe
Álvaro Felipe
José Luján
Jonathan MirCha
Álvaro Felipe
Álvaro Felipe
Beto Quiroga, Alexys Lozada
Álvaro Felipe
Juan Villalvazo
Luis Avilés
Jonathan MirCha
Jonathan MirCha
Jonathan MirCha

Aplicaciones Web Progresivas: La evolución del Diseño Responsivo

PWA EDteam

Hola gente de EDteam...

...soy su amigo y docente digital Jonathan MirCha, y en esta ocasión quiero hablarles de las Progressive Web Apps (PWAs).

El ámbito de las tecnologías web frontend (HTML, CSS y JavaScript) es un área que se ha movido increíblemente rápido en los últimos años. Un escenario común es que muchas empresas han estado construyendo y desplegando herramientas en forma de aplicaciones nativas, principalmente debido a requerimientos alrededor de características que la web históricamente no ha ofrecido o que los navegadores no han soportado.

La mejor manera de hacer cosas como leer contenido fuera de línea o tener notificaciones push. La construcción de un sitio web y varias aplicaciones para diferentes plataformas puede ser costosa y dificultar el mantenimiento. Algunas empresas hoy tienen la problemática de tener numerosas aplicativos (a través de diferentes plataformas) que necesitan ser construidas, administradas y actualizadas, cuando en realidad, desde la llegada de HTML5 y el Responsive Design las tecnologías web han hecho grandes saltos para este tipo de casos.

¿Qué es una aplicación web progresiva?

Las aplicaciones web progresivas (denominadas PWA, porque todo en tecnología necesita un acrónimo) es el término que encapsula los sitios y aplicaciones web que cumplen determinados criterios técnicos. La implicación de la "aplicación" en el nombre no es un accidente, estas creaciones comparten gran parte de la funcionalidad que encontrarás en las experiencias nativas, pero en realidad, son desarrollos 100% webs.

El sitio introductorio de aplicaciónes web progresivas de Google dice:

"... son experiencias de usuario que tienen el alcance de la web, y son:

Confiables: Cargue instantáneamente y nunca muestre el downasaur, incluso en condiciones de red inciertas.
Rápidas: Responde rápidamente a las interacciones de los usuarios con animaciones suaves y sin movimientos bruscos.
Atractivas: Se siente como una aplicación natural en el dispositivo, con una experiencia de usuario inmersiva.

Este nuevo nivel de calidad permite a las aplicaciones web progresivas ganar un lugar en la pantalla de inicio del usuario. "

En pocas palabras, PWAs pueden trabajar sin conexión, aceptan notificaciones, tienen un rendimiento superior y seguro gracias al manejo de recursos en cache, se debe poder acceder a ellas desde la pantalla de inicio del dispositivo, la carga es rápida sin sentirse como si estuvieran ejecutándose en un navegador, entre algunas otras características.

Puedes ver varios ejemplos de PWAs que ya se encuentran en producción funcionando en pwa.rocks, que es un sitio que recoge numerosos ejemplos de diferentes tipos de aplicativos que van desde: mapas, interactivos, audio, video, juegos hasta noticias, compras y un libro on/offline. Además, en esta lista podemos encontrar nombres de empresas como la NASA, el Financial Times, Flipboard y Ali Express (El Amazon de oriente :P); por lo que si grandes empresas están centrando sus esfuerzos en este tipo de desarrollos  deberíamos empezar a mirarlas como más que una simple moda, sino como la evolución natural del diseño web responsivo.

Dentro de estos ejemplos, hay algunas cosas importantes que aprender acerca de cómo funcionan las PWAs. Si vas al sitio de cualquiera de estás y después apagas tu conexión a Internet, deberías poder seguir usándolos en cierta medida; tal vez no puedas acceder a todas las páginas (por lo general, debes visitar cada página de manera individual primero para que se quedé en tu cache), pero esto dependerá en gran medida de cómo se ha planificado la aplicación para trabajar.

Otra cosa importante de estos sitios o aplicaciones es que ofrecen es la capacidad de "instalar" la aplicación en la pantalla de inicio con un icono personalizado, como lo haría una aplicación nativa en Android o iOS. Si la aplicación web cumple con ciertos criterios, te debe mostrar un mensaje como este:

add to home screen

Podemos hacer algunas cosas brillantes con las tecnologías web hoy en día, y me gustaría animar a todos a aprender más sobre lo que es posible en este momento, así como lo que será posible muy pronto. No se olviden si algo está disponible para algunos y no para otros en este momento, no es una razón para privar a los que pueden utilizarlo. Mediante el uso de la mejora progresiva, podemos construir experiencias que todos puedan consumir.

Si quieres saber más sobre lo que la web puede hacer mira los sitios whatwebcando.today y caniuse.com. También puedes tomar el curso sobre PWA's que tenemos en EDteam.

Se despide su amigo y docente digital Jonathan MirCha, sean felices, hasta siempre, nos leemos la próxima semana... 

...bye ;)

Suscríbete al blog de EDteam

Ingresa tu correo electrónico para recibir nuestro boletín semanal