android - una - pwa template

Qué características tienen las aplicaciones web progresivas frente a las aplicaciones nativas y viceversa, en Android

Question

En 2015, Google introdujo un nuevo enfoque para desarrollar aplicaciones web para Android: aplicaciones web progresivas . Se puede crear una aplicación que se verá como una aplicación nativa, podrá usar el hardware del dispositivo como cámara y acelerómetros, recibir notificaciones push, tener un icono de iniciador, trabajar sin conexión, almacenar datos locales, etc.

En Android, qué características proporcionan las aplicaciones nativas que las aplicaciones web progresivas no admiten, y viceversa.

Answer 1

La principal ventaja para las aplicaciones nativas es que pueden acceder a todas las API nativas que una plataforma podría ofrecer (contactos, flash de cámara, SMS, telefonía, red, bluetooth, sensores, enchufes sin procesar ...), mientras que una aplicación web progresiva no puede (todavía) ya que están limitados por las capacidades web estándar.

El objetivo de las aplicaciones web progresivas es ampliar estas capacidades para cubrir los casos más críticos. En este estado de ánimo, eche un vistazo a las aplicaciones web progresivas: escapar de pestañas sin perder nuestra alma, donde puede encontrar una lista de lo que debería ofrecer una aplicación web progresiva:

• Responsivo: para adaptarse a cualquier factor de forma
• Conectividad independiente: mejorado progresivamente con Service Workers para permitirles trabajar sin conexión
• Interacciones similares a las aplicaciones: adopte un modelo de aplicación Shell + Content para crear navegaciones e interacciones de aplicaciones
• Fresco: Transparentemente siempre actualizado gracias al proceso de actualización de Service Worker
• Seguro: Servido a través de TLS (un requisito de Service Worker) para evitar espiar
• Descubrible: son identificables como "aplicaciones" gracias a los alcances de registro de W3C Manifests y Service Worker que permiten a los motores de búsqueda encontrarlos
• Reconectable: puede acceder a las IU de reincorporación del sistema operativo; por ejemplo, notificaciones push
• Instalable: en la pantalla de inicio a través de indicaciones proporcionadas por el navegador, lo que permite a los usuarios "mantener" las aplicaciones que encuentran más útiles sin la molestia de una tienda de aplicaciones
• Vinculable: lo que significa que son de fricción cero, instalación cero y fáciles de compartir. El poder social de las URL es importante.

Desde estos puntos, el enlace fue una de las primeras características importadas por las aplicaciones nativas de la Web abierta en forma de enlaces profundos móviles .

Pero una mención especial merece el combo fresh + installable ya que representa una de las principales ventajas de la Web como plataforma sobre las alternativas nativas . Aquí instalable significa que aparece en su pantalla de inicio. No significa que deba pasar las etapas de descarga e instalación. Abre una URL o descubre un servicio mientras navega y ya está: aparece en su pantalla de inicio .

Fresh se refiere a cómo funciona una web normal, que ofrece una carga instantánea y actualizaciones perfectas. No se le pide que instale una actualización desde la web de YouTube, se implementa y la consume la próxima vez que la visite.

No estoy hablando de los beneficios de los puntos restantes porque estaba preguntando por las diferencias y, por ejemplo, el reenganche es algo que las aplicaciones nativas ya tienen a través de servicios push y notificaciones y ahora las aplicaciones web se han puesto al día.

Otra pregunta relacionada y clave es sobre qué plataforma es más adecuada para sus necesidades. Si no está accediendo a capacidades especiales de hardware, la Web debería ser suficiente y elegir la web que está libre de los mercados, ecosistemas patentados y, por cierto, puede garantizar cierto grado de ubicuidad e interoperabilidad .

Como notas finales, le recomiendo que navegue en www.flipkart.com desde un dispositivo móvil con Chrome. Es bastante impresionante: sin errores, navegación fluida, sensación de aplicación. Desconéctate y continuará funcionando. Un verdadero ejemplo del mundo real de esa publicación. Agregue la aplicación a la pantalla de inicio y la próxima vez que la abra, la experiencia será aún mejor.

Puede echar un vistazo al sistema operativo Firefox , así como un ejemplo de traer más API de plataforma a la Web estándar (con más o menos éxito).

Answer 2

TL; DR: a partir de febrero de 2017, las aplicaciones web progresivas son una plataforma lo suficientemente potente como para que Twitter haya movido todo su tráfico web móvil a una PWA React .

A partir de agosto de 2016, las aplicaciones web progresivas en realidad ofrecen más acceso al hardware de lo que comúnmente se piensa. Aquí hay una captura de pantalla de whatwebcando.today desde mi Chrome 52 estable en Android:

El acceso al hardware incluye

• geolocation : compatible con la gran mayoría de los navegadores
• cámara y micrófono a través de getUserMedia/Stream y las próximas API MediaStream Image Capture
• vibration dispositivo
• orientación de la pantalla y acceso al acelerómetro , incluyendo brújula y giroscopio
• Estado de la batería

Próximo acceso al hardware

Estas características se están implementando o ya funcionan en algunos navegadores:

• Bluetooth a través de la API web Bluetooth
• NFC
• sensor de luz ambiental ( works en Firefox 48+)
• sensor de proximidad ( works en Firefox 48+)
• Acceso a sensor accelerometer , magnetometer y gyroscope
• API de detección de forma

Otro punto importante a tener en cuenta es que Origin Trials Framework ( implementado en Chrome ) permite a los fabricantes exponer y probar las capacidades de hardware (o software) sin tener que pasar por el proceso de estandarización. Por ejemplo, un fabricante de teléfonos podría exponer una API para leer los valores de un sensor de presión, refinarlo y luego enviarlo para su consideración al W3C.

Además del acceso al hardware, también hay características de software empleadas tradicionalmente por aplicaciones nativas que ahora están disponibles para aplicaciones web.

Características tradicionalmente nativas que los PWA también pueden usar

• notificaciones push
• trabajando sin conexión
• Agregar un icono a la pantalla de inicio
• que aparecen en la lista de aplicaciones gracias a WebAPKs - ¡Las aplicaciones web progresivas ahora se pueden empaquetar en paquetes de Android reales instalables!
• lanzamiento en full-screen
• acceso al portapapeles

• Gráficos 2D / 3D acelerados por hardware a través de HTML5 Canvas o WebGL : consulte algunas de las demostraciones de HTML5 Canvas , los sitios WebGL o la biblioteca three.js . Un punto de referencia de 2014 del motor de juego multiplataforma Unity comparó el rendimiento de renderización nativa versus WebGL, y concluded que

  "Lo más importante es que, si bien todavía hay áreas donde WebGL es significativamente más lento que el código nativo, en general ya se puede esperar un rendimiento muy decente, y esto solo puede mejorar en el futuro".

  La brecha se ha estado cerrando .

• reading archivos seleccionados por el usuario en cualquier navegador
• IU lisas y suaves con animaciones de 60 fps

Estas características cubren muchos casos de uso, y muchas aplicaciones nativas populares hoy en día podrían reescribirse como PWA. Tome Slack, por ejemplo. Su alternativa de código abierto, Rocket.Chat, está construyendo una versión PWA . Para obtener más demostraciones de PWA, consulte https://pwa.rocks .

Características nativas que llegan a PWAs

• manejo de intenciones , por ejemplo, compartir una página con otra aplicación o ser el objetivo de compartir , por ejemplo, una aplicación de chat PWA que recibe una imagen para establecer como avatar del usuario

Las características nativas de Android aún no están disponibles para las PWA

• acceso al sensor de huellas digitales ( en desarrollo )
• contactos, calendario y acceso a marcadores del navegador (la falta de acceso a estos podría ser vista como una feature por los usuarios conscientes de la privacidad)
• alarmas
• funciones de telefonía: interceptar SMS o llamadas, enviar SMS / MMS, obtener el número de teléfono del usuario, leer el correo de voz, hacer llamadas telefónicas sin el cuadro de diálogo Marcador
• acceso de bajo nivel a algunas funciones y sensores de hardware: linterna, sensor de presión atmosférica
• acceso al sistema: gestión de tareas, modificación de la configuración del sistema, registros

Las aplicaciones web progresivas ofrecen características que carecen de aplicaciones nativas

• capacidad de descubrimiento: los motores de búsqueda pueden encontrar fácilmente el contenido de las aplicaciones web progresivas, pero una aplicación nativa centrada en el contenido como no se mostrará entre los resultados de búsqueda de la tienda de aplicaciones para contenido al que sí ofrece acceso, como "pwa vs. nativo". Este es un problema para comunidades como Reddit, que no pueden exponer sus numerosas subcomunidades a la tienda de aplicaciones como "aplicaciones" individuales.
• enlazabilidad : cualquier página / pantalla puede tener un enlace directo, que se puede compartir fácilmente
• marcadores : guarde ese enlace para acceder a la vista de una aplicación directamente
• siempre fresco : no es necesario ir a las tiendas de aplicaciones para enviar actualizaciones
• acceso universal : no sujeto a las tiendas de aplicaciones, a veces políticas arbitrarias o restricciones geográficas (no intencionadas)
• Grandes ahorros de datos , extremadamente importantes en los mercados emergentes con acceso a Internet costoso y / o lento. Por ejemplo, el sitio web de comercio electrónico Konga redujo el uso de datos en un 92% para la primera carga al migrar a una PWA .
• baja fricción de distribución : si su aplicación web progresiva está en línea, ya está disponible para usuarios de Android (y otros dispositivos móviles).
  • El 65.5% de los usuarios de teléfonos inteligentes de EE. UU. No descargan ninguna aplicación nueva cada mes
  • Los PWA eliminan la necesidad de ir a la tienda de aplicaciones, buscar la aplicación, hacer clic en Instalar, esperar la descarga y luego abrir la aplicación. Cada uno de estos pasos pierde el 20% de los usuarios potenciales.

Nota final: los PWA se ejecutan, con la misma base de código, en el escritorio y en la mayoría de los dispositivos móviles. En entornos de escritorio (ChromeOS, y later Mac y Windows), se inician de la misma manera que otras aplicaciones y se ejecutan en una ventana de aplicación normal (sin pestaña del navegador).