¿Qué es el 'navegador' en las aplicaciones web progresivas?

Cómo el 'navegador' permite mejorar progresivamente sus aplicaciones web

¿Qué es el "navegador" en las aplicaciones web?

Si es compatible, el objeto "ventana" global en su aplicación web proporciona acceso al objeto "navegador". El "navegador" contiene potencialmente mucha información sobre la aplicación y puede darle acceso a ciertos eventos a los que suscribirse. Le ayuda a escribir aplicaciones web realmente modernas que pueden parecer casi nativas.

Una instancia del "navegador" está directamente vinculada al agente de usuario, que es la aplicación que ejecuta su aplicación web: el navegador.

Cómo el "navegador" puede mejorar progresivamente su aplicación

"Mejorar progresivamente" significa que el "navegador" ofrece un cierto conjunto de capacidades basadas en el navegador que aloja la aplicación. Por ejemplo, Chrome de Google siempre tuvo la mayoría de las funciones implementadas, incluso las inestables, ya que Google empuja los límites de las aplicaciones web progresivas constantemente.

Como verá en todos los ejemplos en la documentación de MDN, debe asegurarse de que la variable o función a la que desea acceder esté realmente disponible en el "navegador".

// Just a simple example of how
// to check for availability 
// of features.


function checkNetwork(){
  if("connection" in navigator){
    // Now it's safe to use 'navigator.connection'.
    // 👉 https://developer.mozilla.org/en-US/docs/Web/API/Navigator/connection
  }
  
  // Alternative if you're using:
  // 'navigator?.connection'
}

Alguna información que el "navegador" le permite consumir en su aplicación:

  • número de núcleos de CPU
  • información detallada de la red
  • estado de la batería del dispositivo que ejecuta su aplicación, por ejemplo, la tableta o el teléfono inteligente
  • lectura y seguimiento de la geolocalización actual
  • usar el menú nativo del anfitrión para compartir contenido
  • controlando la sesión de medios

De hecho, puede ver algunas de esas funciones en vivo y en acción en esta misma PWA. Simplemente desplácese hacia abajo hasta el final de cualquier página, donde puede ver algunas de las implementaciones de métricas de hardware disponibles, por ejemplo, la cantidad de núcleos de CPU.

Trabajando con el "navegador"

Este artículo solo tiene como objetivo brindarle una breve introducción a las posibilidades que ofrece el "navegador" para las aplicaciones web progresivas. MDN tiene una gran página de descripción general, así como documentación sobre cada una de las funciones disponibles.

Para Chrome de Google, también está el "Proyecto Fugu", que implementa nuevas funciones experimentales, solo disponible detrás de una marca de función en los navegadores Chromium.