01- ¿Qué son las aplicaciones web progresivas?
Summary
TLDRLas Progressive Web Apps (PWA) son una nueva generación de aplicaciones web que, aunque no son extensiones del navegador, frameworks, plugins o librerías, ofrecen una experiencia similar a las aplicaciones nativas. Estas aplicaciones web pueden ser instaladas en el home screen, funcionan sin conexión a Internet y utilizan características nativas del dispositivo. A diferencia de las aplicaciones nativas, las PWA son más livianas, rápidos en cargar y se actualizan sin intervención del usuario. Ejemplos como la PWA de Twitter, que pesa menos de 80k en comparación con la aplicación nativa de 20 megas, demuestran la ventaja de estas tecnologías.
Takeaways
- 🌐 Las Progressive Web Apps (PWA) no son una extensión del navegador, un framework, un plugin ni una librería para frameworks existentes.
- 📱 PWA están diseñadas con 'mobile first' en mente, lo que significa que se crean pensando en dispositivos móviles primero, luego tabletas y finalmente en pantallas grandes.
- 🚫 Una PWA no es una aplicación responsiva ni una aplicación nativa, y no requiere de app stores para su instalación.
- 🌐 Una PWA puede ser indistinguible de una aplicación nativa, ofreciendo características como notificaciones push y acceso a la pantalla de inicio del dispositivo.
- 🔄 PWA funcionan sin conexión a internet y pueden utilizar características nativas del dispositivo.
- 🚀 PWA son atractivas para los usuarios, confiables, ligeras y rápidas en cargar, lo que es especialmente ventajoso en comparación con aplicaciones nativas.
- 📲 Las aplicaciones nativas suelen ser más pesadas y requieren actualizaciones a través de app stores, mientras que las PWA se pueden actualizar sin intervención del usuario.
- 📱 Las PWA pueden ser más livianas que sus equivalentes nativos, como en el caso de la aplicación de Twitter, que pesa 20 MB en comparación con menos de 80 KB para la PWA.
- 🛠️ La ventaja de construir una PWA incluye la facilidad de actualización y el menor consumo de espacio en dispositivos, lo que puede ser crucial para usuarios con limitaciones de almacenamiento.
- 🔍 El siguiente vídeo explorará más sobre las razones para construir una PWA y sus beneficios comparativos con aplicaciones nativas.
Q & A
¿Qué son las Progressive Web Apps (PWA)?
-Las Progressive Web Apps son aplicaciones web que se vuelven progresivamente más avanzadas, implementando características como notificaciones push, acceso al home screen y funcionamiento sin conexión, similares a las aplicaciones nativas.
¿Qué no son las PWA según el guion?
-Las PWA no son una extensión del navegador, un framework como React o Angular, un plugin o una librería para frameworks, ni son similares a Flash o Silverlight.
¿Por qué se menciona Facebook en el guion como ejemplo de una aplicación web?
-Facebook se menciona como ejemplo de una aplicación web para ilustrar cómo una PWA puede parecer y funcionar en comparación con una aplicación web tradicional, aunque no es un buen ejemplo de PWA debido a su falta de funcionalidad sin conexión.
¿Qué significa 'mobile first' en el contexto de las PWA?
-Mobile first significa diseñar la aplicación o página web pensando primero en los usuarios que la utilizarán en dispositivos móviles, luego en tabletas y finalmente en pantallas grandes o de escritorio.
¿Qué es una aplicación nativa y cómo se diferencia de una PWA?
-Una aplicación nativa es aquella que se instala a través de las tiendas de aplicaciones, corre en pantalla completa y a menudo se puede agregar al home screen del dispositivo. Las PWA, por otro lado, son aplicaciones web que implementan características similares a las nativas pero sin la necesidad de instalarlas desde una tienda de aplicaciones.
¿Cuáles son las ventajas de las PWA sobre las aplicaciones nativas según el guion?
-Las PWA son ligeras, rápidas en cargar, pueden ser actualizadas sin intervención del usuario y funcionan sin conexión a internet, lo que las hace más atractivas y confiables para los usuarios.
¿Por qué podría ser ventajoso construir una PWA en lugar de una aplicación nativa?
-Al construir una PWA, se evita la necesidad de publicar en tiendas de aplicaciones, se reduce el tamaño de descarga y se puede actualizar sin intervención del usuario, lo que puede resultar en una experiencia de usuario más satisfactoria.
¿Cuál es la relación entre el tamaño de una aplicación nativa y una PWA, según el ejemplo de Twitter en el guion?
-El guion menciona que la aplicación nativa de Twitter pesa 20 megas, mientras que la PWA de Twitter pesa menos de 80 kilobytes, lo que demuestra la diferencia significativa en tamaño y la ventaja de las PWA en términos de almacenamiento y velocidad de carga.
¿Qué características definen a una buena PWA según el guion?
-Una buena PWA debe ser indistinguible de una aplicación nativa, cargar rápidamente, ser confiable y estar actualizada, además de ser ligera y funcionar sin conexión a internet.
¿Qué es lo que 'no' hacen las PWA con respecto a las actualizaciones, según el guion?
-Las PWA no solicitan al usuario que las actualicen; en cambio, el desarrollador tiene control sobre cuándo se realizan las actualizaciones.
Outlines
🌐 Introducción a las Aplicaciones Web Progresivas (PWA)
El primer párrafo introduce el concepto de Aplicaciones Web Progresivas (PWA), explicando que no son una extensión del navegador, un framework, un plugin o una librería. Se menciona que PWA están diseñadas con una filosofía 'mobile first', es decir, se crean pensando en dispositivos móviles primero, luego tabletas y finalmente en pantallas grandes. Se da un ejemplo con Facebook, destacando que, aunque es una aplicación web, no es un buen ejemplo de PWA debido a su comportamiento en ausencia de conexión a Internet. Se enfatiza que las PWA son aplicaciones web que implementan características como notificaciones push, pueden ser instaladas en el home screen, funcionan sin conexión y utilizan características nativas del dispositivo. Además, se resalta que las PWA son atractivas, confiables, livianas y rápidas en cargar, y que su diferenciación con aplicaciones nativas es que no requieren actualizaciones manuales y suelen ser menos pesadas en tamaño.
Mindmap
Keywords
💡Aplicaciones Web Progresivas (PWA)
💡Mobile First
💡Notificaciones Push
💡Sin Conexión a Internet
💡Características Nativas del Dispositivo
💡Confiable
💡Peso de la Aplicación
💡Actualización
💡Tiendas de Aplicaciones
💡Ejemplo de Facebook
Highlights
Las aplicaciones web progresivas (PWA) no son una extensión del navegador, un framework, un plugin o una librería.
PWA no es similar a frameworks como React, Angular, ni a plugins o librerías como jQuery o Underscore.
Ejemplo de una aplicación web: Facebook, que se comporta de cierta manera al ingresar desde un navegador.
Las PWA están diseñadas con un enfoque 'mobile first', pensando primero en dispositivos móviles.
Una aplicación nativa se instala a través de app stores y corre en pantalla completa.
Las PWA pueden implementar características como notificaciones push y ubicarse en el home screen.
PWA funcionan sin conexión a internet y utilizan características nativas del dispositivo.
Las PWA son atractivas, confiables, ligeras y rápidas en cargar.
Una PWA bien hecha es indistinguible de una aplicación nativa.
Las PWA pueden cargarse más rápido y estar actualizadas sin necesidad de intervención del usuario.
Las aplicaciones nativas suelen ser más pesadas y requieren actualizaciones manuales por parte del usuario.
Las PWA tienen el control de cuándo se actualizan, sin preguntar al usuario.
Las aplicaciones nativas suelen pesar mucho más que sus equivalentes PWA, como en el caso de Twitter.
El caso de Twitter muestra que una PWA puede tener una funcionalidad similar a la nativa pero con un peso menor.
La razón para construir una PWA se explorará en el siguiente vídeo.
Transcripts
vamos a comenzar con este tema que son
las aplicaciones web progresivas a lo
largo del curso nos vamos a referir a
este tipo de aplicaciones a las
aplicaciones web progresivas con el
nombre de w
wv como ustedes le digan a esa letra una
p w es el acrónimo de inglés the
progressive web apps o aplicaciones web
progresivas antes de explicarles que son
déjenme decirles que no son primero una
w
no es una extensión del navegador web no
es un framework como jacques view
angular no es un plugin o una librería
para esos frameworks no es nada parecido
a ryanair y negri script o ironic
déjenme ponerles un pequeño ejemplo acá
la página de facebook puntocom en la
página web es algo así y cuando ustedes
entran desde un navegador web a la
aplicación de facebook luce de esta
manera facebook es una aplicación web y
yo les pongo a ustedes este ejemplo
porque yo no quiero que ustedes piensen
que una w es responsible y saint no nada
que ver y éste tampoco es un curso de
css
algo que si tienen las problemas es que
están pensadas en mobile first esto
quiere decir que nosotros vamos a
diseñar nuestra aplicación web o nuestra
página web pensando en que los usuarios
van a ingresar a ella utilizando su
dispositivo móvil
luego tabletas y por último pantallas
grandes o de escritorio el problema de
facebook es que no es un buen ejemplo
porque cuando ustedes no tienen una
conexión a internet simplemente ven esta
imagen antes de explicarle que es una p
w quiero que tengamos claro lo que es
una aplicación nativa una aplicación
nativa se instala mediante las app
stores correr en pantalla completa el
dispositivo y muchas veces se ganan el
derecho de estar en nuestro home screen
o en la pantalla principal de nuestro
teléfono en algún lugar de ahí una w
es una aplicación web que también puede
ser una página web que progresivamente
va implementando características como
push notifications una ubicación en
nuestro home screen que es totalmente
indiferenciable de una aplicación nativa
funciona sin conexión a internet usa
características nativas del dispositivo
constantemente es atractiva para los
usuarios es confiable pesa muy poco y es
rápida a la hora de cargar esto es una p
w una pelo legua bien hecha es
totalmente indiferenciable de una
aplicación nativa habrá una p w puede
cargar más rápido es confiable y está
actualizada porque mencionó estas tres
características porque normalmente una
aplicación nativa nosotros tenemos que
ir a la appstore marcar que se actualice
para que ésta descarguen y pues
eventualmente ya la tendríamos
actualizada yo sé que ustedes pueden
activar la opción para que se actualicen
en segundo plano pero muchos usuarios
nunca actualizan sus aplicaciones porque
usualmente tenemos alguna limitante de
espacio en nuestro dispositivo físico no
todos tenemos teléfonos de un tegra de
disco o dos telas de disco dónde podemos
instalar lo que se nos dé la gana muchas
veces no las actualizamos porque pesan
mucho y aquí es donde viene una ventaja
de las problemas las problemas no le
preguntan al usuario si se quieren
actualizar o no ustedes tienen el
control de cuando se quiere actualizar o
no
algo interesante es que las aplicaciones
nativas usualmente pesan mucho más que
su equivalente de w por ejemplo twitter
twitter pesa 20 megas pero la p wv de
twitter pesa menos de 80 k ni siquiera
un mega y puede hacer exactamente lo
mismo que hace la aplicación nativa de
twitter ahora se van a preguntar por qué
construir una p doble ua bueno eso es
tema del siguiente vídeo
Посмотреть больше похожих видео
1. Tipos de Aplicaciones Móviles : WebApp - Nativas - Hibridas
Plataformas de Desarrollo de Apps ‐ Hecho con Clipchamp
Aprendiendo sobre la WEB3 - El futuro de Internet?
Desarrollo de Aplicaciones moviles en 2024
Curso Diseño UI - 5. Diseñar para Webs vs Apps
¿Tu teléfono te escucha? La perspectiva de un Ingeniero de Software
5.0 / 5 (0 votes)