Aprendiendo a medir

📏 Aprendiendo a medir

lo que no mide, no se mejora

• Rail Model:
  • Centrado en el usuario
  • Métricas de rendimiento basadas en la experiencia de usuario

Entregar el contenido y ser interactiva en menos de 5 segundos

• Esta frase parcialmente es cierta por que debemos recordar que no todos los usuarios tendrán la misma velocidad de internet

Cumplir las métricas para los usuarios del percentil 75%

• No basta concentrarse en un numero concreto si no que consiste en dar un buen recorrido por todas la pagina

RESUMEN: Lo importante es dar una experiencia de usuario en TODO el sitio web.

Excelente, con esto he podido ver que recursos hace que se demore en cargar más la página pero también quiero que vaya cargando desde antes como mostró en el ejemplo 🧐

El curso de devtools es realmente una joya que deben tomar antes de este curso. Es mi opinión, espero les ayude (:

Usando DuckDuckGo… Nada mal 😉

En resumen, el performance es sobre la experiencia que le damos a nuestros usuarios en nuestros sitios web.

Creo que son muchas variables a considerar para hacer esta medición; internet, tipo de internet, teléfono, tipo de teléfono, clima, zona (cobertura), tipo de usuario, etc.

Lo que no se mide no se mejora

Herramientas principales para medir

• Chrome DevTools
  • Pestaña de Network
  • Lighthouse

RAIL Model

• Centrada en el usuario
• Métricas de rendimiento basadas en la experiencia de usuario.

" Entregar el contenido y ser interactiva en menos de 5 segundos "

" Performance is about user experience "

¿Qué medimos?

.
El modelo RAIL está centrado en el usuario, y por eso todas las métricas que este modelo nos invita a tomar son métricas que nos ayudan a medir la experiencia de usuario.
.
RECUERDEN: el “performance” es algo totalmente subjetivo, y por eso mismo es muy difícil pornerle una medida a cada uno de ellos.
.
Según el modelo RAIL, hay que cumplir las métricas para la mayoría de los usuarios, específicamente deberíamos estar en el percentil en el número 75.
¿Qué significa esto?
Significa que cuando tengamos todas las gráficas de nuestros datos, y estén ordenados de menor a mayor, y al dividir entre cuatro partes esas gráficas, al menos tres de esas cuatro partes deberían ser satisfactorias para la medida que estamos buscando.
.
¿Es suficiente medir el tiempo de carga?
Para esto hay que ver “la experiencia de usuario”. El “performance” es sobre la experiencia de usuario. No basta solo con que nos enfoquemos unicamente en un número al finalizar; lo que más importa es la experiencia que le estamos brindando a los usuarios en todo el tiempo de carga

.

Nosotros tenemos que garantizar que las optimizaciones y que las medidas que ofrecemos a todos nuestros usuarios sean igual de buenas.

Antes de optimizar, debemos MEDIR.
Sino medimos nuestros códigos, sino medimos nuestras páginas, nunca vamos a saber si está mejorando.
.

Lo que no se mide, no se mejora

.
Herramientas para medir
Chrome DevTools
Las dos pestañas que más vamos a usar son:

• Pestaña “Network”: esta pestaña es una de las más importantes porque esta pestaña graba TODO lo que pasa entre tu computador e Internet. Podemos ver todos los “request” que está haciendo una página. Nos permite ver el peso de cada uno de los archivos, su prioridad y el “waterfall” (que es cómo cargan cada uno de los recursos)
• Pestaña “Lighthouse”: es la que va a generar los reportes de cómo se está comportando nuestro sitio en términos de “performance” (desempeño).

Algo que nos ayuda mucho para que nuestros usuarios tengan una mejor experiencia y sepan que está pasando algo tras bambalinas mientras por ejemplo cargan los recursos de una API son los loading skeletons. Dejo recurso por si le quieren echar una miradita.
https://platzi.com/blog/tutorial-como-crear-una-animacion-de-carga-de-contenido-tipo-facebook/

Baldra la Pena eston?🙉

viendo la pestaña network me acabo de fijar que tengo 68 request y todos finalizan al tiempo, me motiva saber que se puede mejorar!!!

😊