¿Por qué podrías necesitar una PWA para tu negocio?

Compartir en

Video más reciente

Nuevo PodCASTOR

A VPN is an essential component of IT security, whether you’re just starting a business or are already up and running. Most business interactions and transactions happen online and VPN
responsividad de las PWA

Tu negocio y las PWA

La tecnología da pasos de gigante cada día y en el universo de la computación el desarrollo del hardware y el software avanzan hora tras hora. Uno de los grandes hitos de la telefonía inteligente es, sin duda alguna, el lanzamiento en 2007 del primer teléfono inteligente de Apple que contaba además con un sistema operativo propio. Los de cupertino declararon que se podrían hacer aplicaciones para dicha plataforma a través de HTML5 y  AJAX. Sin embargo, su pobre desempeño, su lentitud al cargar y su falta de acceso a funcionalidades del dispositivo llevaron a los amigos de la manzana a cambiar de idea. Esto llevó al desarrollo del App Store con su kit de aplicaciones para IOS, presentados al público en 2008 (Ritchie, 2020).

[dt_gap height=»20″ /]

Años después Mozilla presentó el sistema operativo Firefox OS, diseñado para dispositivos móviles de gama media y baja, que se comercializarían en países como Brasil, Colombia, Venezuela, Polonia, España, entre otros. A pesar de los esfuerzos realizados para hacerse un espacio entre Android y iOS, el proyecto terminó cerrando sus puertas en 2015 y su soporte en 2016.

[dt_gap height=»20″ /]

Mientras que Firefox OS desaparecía, Frances Berriman y Alex Russell, el primero diseñador web y el segundo ingeniero de google Chrome, fueron los primeros en acuñar el término Progressive Web App (PWA), en español Aplicaciones Web Progresivas, y describir las características necesarias para considerarse en esta categoría (Russell, 2020).

[dt_gap height=»40″ /]

¿Qué es una PWA?

[dt_gap height=»20″ /]

PWA es la sigla utilizada para Progressive Web App, o Aplicaciones Web Progresivas, y que se definen, a su vez, como aplicaciones entregadas al usuario a través de la Web construidas en HTML, CSS y Javascript. Gracias a esto, es posible usarlas en cualquier navegador web moderno sin importar el sistema operativo (Wikipedia, 2020).

[dt_gap height=»40″ /]

¿Qué otros tipos de Apps existen?

[dt_gap height=»20″ /]

Junto a las Progressive Web Apps, podemos encontrar los siguientes tipos de aplicaciones:

[dt_gap height=»20″ /]

Apps nativas: Son software desarrollados para ser ejecutados en una plataforma o dispositivo en particular. Por ejemplo, una aplicación nativa para Android está escrita en Java y sólo puede ejecutarse en dicho sistema operativo.

[dt_gap height=»20″ /]

Apps híbridas: Son software desarrollado para ser ejecutado en una plataforma específica pero que fue escrito en tecnologías web: HTML5, CSS y Javascript. Funciona dentro de un contenedor, para que se pueda instalar y descargar igual que las Apps nativas; siendo esta la principal diferencia con respecto a las PWA, que no usan esta clase de encapsulamiento para su distribución.

[dt_gap height=»40″ /]

Características de una PWA

[dt_gap height=»20″ /]

Responsiva. Para que pueda adaptarse a cualquier dispositivo sin importar las dimensiones de su pantalla.

[dt_gap height=»20″ /]

responsividad de las PWA

Fuente: https://i.pinimg.com/originals/e8/d8/3e/e8d83e14bb6d1874f85d36213b1dac40.gif

[dt_gap height=»20″ /]

Conectividad independiente. Puede trabajar de igual forma sin importar si hay o no conexión a internet.

[dt_gap height=»20″ /]

 

Fuente: https://media.giphy.com/media/UuTIijN6ih5kzV9nNI/source.gif

[dt_gap height=»20″ /]

Interacción como las aplicaciones nativas. El usuario la percibe como si se tratara de una aplicación nativa.

[dt_gap height=»20″ /]

¿Por qué podrías necesitar una PWA para tu negocio?

Fuente: https://mir-s3-cdn-cf.behance.net/project_modules/disp/3f61ec27118125.5636032dd67b0.gif

[dt_gap height=»20″ /]

Fresca. Es capaz de mantenerse actualizada a través del uso de service workers¹.

[dt_gap height=»20″ /]

Fuente: https://media.tenor.com/images/8dec4e6273538a1023d6d9159793e973/tenor.gif

[dt_gap height=»20″ /]

Segura. Al ser servida mediante protocolo TSL previniendo el “Snooping” ².

[dt_gap height=»20″ /]

via GIPHY

[dt_gap height=»20″ /]

Descubrible. Los motores de búsqueda le encuentran fácilmente, gracias al registro de Service Workers y al manifiesto de Aplicación.

 

[dt_gap height=»20″ /]

Fuente: https://thumbs.gfycat.com/BlaringGaseousEsok-small.gif

[dt_gap height=»20″ /]

Reenganchable. Es capaz de traer de vuelta al usuario a la aplicación con el fin informarle que está sucediendo algo; por ejemplo, mediante notificaciones push disponibles tanto en aplicaciones nativas como en sitios web.

[dt_gap height=»20″ /]

Fuente: https://miro.medium.com/max/1600/1*owlBDVZVDHiEi8pqAklWXQ.gif

[dt_gap height=»20″ /]

Instalable. Genera las indicaciones necesarias en el navegador para instalarse en el dispositivo, mientras se está usando la aplicación, y así el usuario pueda obtener sus aplicaciones favoritas sin necesidad de desplazarse a una tienda de aplicaciones.

[dt_gap height=»20″ /]

Fuente: https://thumbs.gfycat.com/ActualInformalFurseal-small.gif

 

[dt_gap height=»20″ /]

Enlazable. Mediante una URL se da la oportunidad de que esta pueda ser compartida más fácilmente.

[dt_gap height=»40″ /]

PWA vs Apps Híbridas vs Apps Nativas

[dt_gap height=»20″ /]

Con el fin de comparar los tres tipos de Apps mencionados anteriormente, vale la pena detenerse a mirar cinco aspectos fundamentales.

[dt_gap height=»20″ /] 

Parametros

PWA Apps Híbridas Apps Nativas
Reusabilidad del código Alta Alta Baja
Reusabilidad de conocimiento Alta Alta Baja
Librerías de terceros Alta Moderada Alta
Desempeño Baja Moderada Alta
Uso de características nativas del dispositivo Baja Moderada Alta

 

[dt_gap height=»20″ /]

La anterior tabla nos ayudará a decidir qué tipo de aplicación necesitamos en función de diversos factores.

[dt_gap height=»20″ /]

Habitualmente la reusabilidad del código hace referencia a la cantidad de veces que debo escribir el código para una aplicación. Por ejemplo, si debemos crear una aplicación para iOS y Android sería costoso programar para cada sistema operativo dado que se requiere escribir un código para cada lenguaje de programación según el sistema.

[dt_gap height=»20″ /]

El parámetro de la reusabilidad de conocimiento es similar al anterior, pues el programador debe conocer dos lenguajes de programación totalmente diferentes para cada sistema operativo.

[dt_gap height=»20″ /]

En cuanto a las librerías de terceros, estas permitirán saber si el programador tendrá o no a su disposición herramientas que le permitan afrontar retos al momento de programar. Un ejemplo de ello es cuando una aplicación requiere el uso de la localización del usuario, esta debería poder hacerse de forma fácil y efectiva.

[dt_gap height=»20″ /]

En el desempeño se tiene en cuenta el rendimiento en función de la complejidad de la aplicación y los recursos que pueda consumir. Esto no quiere decir que todas las PWA sean deficientes al tener un bajo rendimiento; por el contrario, si la App es sencilla puede cumplir a cabalidad con su objetivo sin afectar negativamente la experiencia del usuario; pero si se trata de un App más compleja, como un juego, lo más conveniente será usar una tecnología que permita mayor rendimiento sobre el dispositivo.

[dt_gap height=»20″ /]

Finalmente, en cuanto al uso de características nativas del sistema operativo o de partes del hardware siempre será mejor hacerlo desde una tecnología que pueda proveer dichas herramientas.

[dt_gap height=»40″ /]

Entonces ¿Por qué podrías necesitar una PWA para tu negocio?

Casos de PWA reconocidos en la industria

[dt_gap height=»20″ /]

Uber: https://m.uber.com

Starbucks: https://www.starbucks.com/menu

Flipboard: https://flipboard.com

Tinder: https://tinder.com

[dt_gap height=»40″ /]

Finalizando

[dt_gap height=»20″ /]

No hay aplicaciones buenas o malas, lo importante es reconocer cuál de los sistemas disponibles es el adecuado para un proyecto. Antes de iniciar con el desarrollo de una aplicación vale la pena detenerse a pensar en variables como Estabilidad, presupuesto, mantenibilidad y desempeño. Esto le ayudará a tomar una buena decisión. Recuerda que en asuntos de tecnología la curiosidad puede llevarnos a encontrar las mejores soluciones para un negocio. De igual forma, esta es una invitación a explorar las diferentes soluciones tecnológicas que podemos encontrar al momento de buscar una solución para su negocio, teniendo en cuenta la velocidad con la que avanzan las tecnologías, especialmente las tecnologías web.

 

[dt_gap height=»20″ /]

Los invitamos, desde Castor, a que tengas en cuenta esta tecnología a la hora de buscar una solución para tu negocio. ¿Quieres que te ayudemos? Escríbenos

[dt_gap height=»20″ /]

Artículo escrito por Álvaro Felipe García Méndez en colaboración con Fabio Oquendo, Claudia Ortíz y Silvia Luz Gutiérrez.

 

¹  “Es una secuencia de comandos que tu navegador ejecuta en segundo plano, separado de una página web, abriéndoles la puerta a funciones que no necesitan una página web ni interacción de usuario” (Gaunt, 2020).

 

² Acto de monitorear un remotamente la actividad de un computador o de un dispositivo de red (Rouse, 2020).

 

Referencias

 

Mantente al tanto de nuestras publicaciones a través de nuestras redes sociales: LinkedIn, Instagram y Twitter, o déjanos tus datos y recibe mensualmente nuestro sumario:

 

Álvaro García

Álvaro García

Ingeniero Electrónico. Programar terminó siendo mi hobby y me permitió embarcarme en la aventura del desarrollo de software. Pedaleo por mis sueños(Sí, como Egan Bernal). Gamer.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Contáctanos

Comunicate con nosotros

Estamos acá para acompañarte en tus estrategias de  Transformación Digital.

Cualquier inquietud no dudes en comunicarse con nosotros.

  • Solicitar propuestas
  • Preguntas sobre nuestros servicios
  • Requerir consultoría profesional