Lección 7: Fundamentos del entorno de ejecución de JavaScript: Perspectiva de rendimiento

Explicación del concepto

"Fundamentos del entorno de ejecución de JavaScript: Perspectiva de rendimiento" te ayuda a pensar en la velocidad y el desperdicio antes de que el código se vuelva desordenado o lento. La lección no busca micro-optimizar todo. En cambio, te enseña a identificar hábitos comunes que afectan el rendimiento, como llamadas de red repetidas, trabajo extra dentro de bucles y esperas innecesarias en código asíncrono. Analizarás un pequeño ejemplo asíncrono, razonarás sobre su costo de ejecución y realizarás mejoras prácticas que mantengan el código legible. Al finalizar, deberías poder explicar no solo lo que hace el código, sino por qué una versión es más ligera y eficiente que otra.

Dónde poner el código

1. Comienza con variables y entradas. Usa la sintaxis de navegador o Node.js claramente.
2. Agrega la lógica de procesamiento en la sección central.
3. Finaliza con la salida y una validación rápida.

Referencia de comandos

• Ejecuta el ejemplo una vez, luego identifica qué partes son trabajo de red y qué partes son procesamiento local.
• Agrega una pequeña salvaguarda, como una verificación de respuesta, sin dificultar el seguimiento de la función.
• Compara una versión derrochadora y una versión más limpia, y explica dónde se eliminó el trabajo innecesario.
• Describe una razón práctica por la que el rendimiento importa aquí, como una retroalimentación más rápida o menos solicitudes repetidas.

Guía paso a paso

1. Ejecuta el ejemplo y observa qué sucede cuando la solicitud tiene éxito.
2. Marca la línea donde comienza la espera asíncrona y la línea donde se utilizan los datos devueltos.
3. Agrega una mejora que haga el flujo más eficiente o seguro, como verificar la respuesta antes de analizarla.
4. Prueba una ruta normal y una ruta de falla para que puedas ver cómo se comporta la función bajo ambas condiciones.
5. Finaliza resumiendo qué cambió y por qué la versión actualizada se adapta mejor a proyectos reales.

Ejercicios prácticos

• Actualiza el ejemplo para que extraiga solo los nombres que necesitas en lugar de pasar los objetos de usuario completos por todas partes.
• Crea una segunda función que reutilice los datos cargados sin hacer una llamada `fetch` adicional.
• Reescribe el ejemplo con una estructura ligeramente diferente y explica qué versión mantendrías para el mantenimiento a largo plazo.

Retos de código

• Refactoriza un pequeño script asíncrono que repite la misma solicitud más de una vez para que los datos se obtengan solo una vez.
• Mejora un ejemplo que se siente lento eliminando un paso innecesario mientras mantienes el resultado fácil de entender.

Mini tareas de práctica

• Agrega una verificación de respuesta.
• Renombra una función para que coincida mejor con lo que devuelve.
• Escribe una oración explicando de dónde proviene el costo principal de este script.