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

En Android, ¿qué características ofrecen las aplicaciones nativas que las aplicaciones web progresivas no son compatibles y viceversa?

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

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

El acceso al hardware incluye

• geolocalización : compatible con la gran mayoría de navegadores
• cámara y micrófono a través de getUserMedia / Stream y las próximas API de captura de imágenes MediaStream
• vibración del dispositivo
• orientación de la pantalla y acceso al acelerómetro , incluida la brújula y el 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 ( funciona en Firefox 48+)
• sensor de proximidad ( funciona en Firefox 48+)
• acceso al sensor de acelerómetro , magnetómetro y giroscopio
• API de detección de formas

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, refinarla y luego enviarla para su consideración al W3C.

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

Funciones tradicionalmente nativas que las 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 instalables reales!
• lanzando en pantalla completa
• 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 juegos multiplataforma de Unity comparó el rendimiento de renderizado nativo con el de WebGL, y concluyó que

  "La conclusión más importante es que, si bien todavía hay áreas en las que 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".

  De hecho, la brecha se ha ido cerrando .

• leer archivos seleccionados por el usuario en cualquier navegador
• Interfaces de usuario elegantes y fluidas con animaciones a 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 las PWA

• manejar 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 establecerla como avatar del usuario

Las funciones nativas de Android aún no están disponibles para las PWA

• acceso al sensor de huellas dactilares ( en desarrollo )
• acceso a los contactos, el calendario y los marcadores del navegador (la falta de acceso a estos podría ser vista como una característica por los usuarios conscientes de la privacidad)
• alarmas
• Funciones de telefonía: intercepte SMS o llamadas, envíe SMS / MMS, obtenga el número de teléfono del usuario, lea el correo de voz, realice llamadas telefónicas sin el cuadro de diálogo Marcador
• acceso de bajo nivel a algunas funciones de hardware y sensores: 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 funciones de las que carecen las 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 StackOverflow no se mostrará entre los resultados de búsqueda de la tienda de aplicaciones para el contenido al que sí ofrece acceso, como "pwa frente a nativo". Este es un problema para comunidades como Reddit, que no pueden exponer sus numerosas subcomunidades a la tienda de aplicaciones como "aplicaciones" individuales.
• vinculabilidad : cualquier página / pantalla puede tener un enlace directo, que se puede compartir fácilmente
• capacidad de marcadores : guarde ese enlace para acceder directamente a la vista de una aplicación
• siempre actualizado: no es necesario pasar por las tiendas de aplicaciones para enviar actualizaciones
• acceso universal : no está sujeto a las tiendas de aplicaciones, a veces, políticas arbitrarias o restricciones geográficas (no intencionales)
• Grandes ahorros de datos , extremadamente importantes en los mercados emergentes con acceso a Internet caro 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 es accesible para los 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
  • Las PWA eliminan la necesidad de ir a la tienda de aplicaciones, buscar la aplicación, hacer clic en Instalar, esperar la descarga y 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, posteriormente, Mac y Windows), se inician de la misma forma que otras aplicaciones y se ejecutan en una ventana de aplicación normal (sin pestaña del navegador).

La principal ventaja de 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, tomas 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 Progressive Web Apps: Escaping Tabs Without Loosing Our Soul, donde puede encontrar una lista de lo que debe ofrecer una aplicación web progresiva:

• Responsive: para adaptarse a cualquier factor de forma
• Independiente de la conectividad: mejorado progresivamente con Service Workers para que puedan trabajar sin conexión
• Interacciones similares a aplicaciones: adopte un modelo de aplicación Shell + Content para crear navegaciones e interacciones de aplicaciones
• Fresh: Transparente y siempre actualizado gracias al proceso de actualización del Service Worker
• Seguro: servido a través de TLS (un requisito de Service Worker) para evitar espionaje
• Detectable: se pueden identificar como "aplicaciones" gracias a los manifiestos del W3C y al alcance de registro del trabajador de servicio que permite a los motores de búsqueda encontrarlos.
• Reenganchable: puede acceder a las IU de reenganche del sistema operativo; por ejemplo, notificaciones push
• Instalable: en la pantalla de inicio a través de las indicaciones proporcionadas por el navegador, lo que permite a los usuarios "conservar" las aplicaciones que encuentran más útiles sin la molestia de una tienda de aplicaciones.
• Vinculables: lo que significa que son de cero fricción, instalación cero y fáciles de compartir. El poder social de las URL es importante.

Desde estos puntos, lo enlazable fue una de las primeras características importadas por las aplicaciones nativas de Open Web en forma de enlaces profundos móviles .

Pero mención especial merecen el combo fresh + installable ya que representa una de las principales ventajas de la Web como plataforma frente a 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. Abres una URL o descubres un servicio mientras navegas y listo: aparece en tu pantalla de inicio .

Fresh se refiere a cómo funciona una web normal, que ofrece una carga instantánea y actualizaciones sin problemas. No se te pide instalar una actualización desde la web de YouTube, se despliega y la consumes la próxima vez que la visites.

No estoy hablando de los beneficios de los puntos restantes porque estabas preguntando por las diferencias y, por ejemplo, volver a interactuar 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 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 eligiendo la Web, está libre de los mercados, los ecosistemas propietarios y, por cierto, puede garantizar cierto grado de ubicuidad e interoperabilidad .

Como notas finales, te recomiendo que navegues por www.flipkart.com desde un móvil con Chrome. Es bastante impresionante: sin errores, navegación fluida, sensación de aplicación. Desconecte y seguirá funcionando. Un ejemplo verdaderamente 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 a Firefox OS , así como un ejemplo de cómo llevar más API de plataforma a la Web estándar (con más o menos éxito).