Hace unas semanas hablamos de compiladores y, en particular, de compiladores para lenguajes dinámicos. JavaScript es un lenguaje interpretado. Necesita un intérprete y un compilador para poder ejecutar el código. En los navegadores, este es un motor de JavaScript. Los más conocidos son:
Google V8 para Chrome y Node
SpiderMonkey para Firefox
JavaScriptCore para Safari/WebKit
El código JS pasa por 3 fases principales:
1 / le análisis
2 / la compilación
3 / la ejecución misma
El análisis se basa en un analizador que tiene la pesada tarea de leer el código JS y convertirlo en un árbol sintáctico abstracto o AST (árbol de sintaxis abstracta). También hablaremos de un árbol de sintaxis abstracta. Esto es fundamental porque sin este código intermedio el compilador no puede actuar. Es después de la compilación que el motor de renderizado JS ejecuta el código. Además de las 3 fases, varios elementos son importantes: el compilador JIT que mejora el rendimiento del código, el almacenamiento en caché en línea y la recolección de basura para la gestión de la memoria y el buen uso de los recursos.
Por supuesto, para el usuario todo esto es transparente, lo mismo para el desarrollador que no tiene que preocuparse por estos problemas. Normalmente el navegador hace el trabajo.
Sin embargo, varias optimizaciones pueden mejorar significativamente el rendimiento y la estabilidad del código, por ejemplo:
– optimizar las manipulaciones y el procesamiento de DOM y utilizar marcos para optimizar el DOM
– bucles y condiciones bien estructurados
– utilizar una sintaxis moderna siguiendo los últimos desarrollos en JS: este punto es importante porque el código antiguo puede ralentizar el motor JS y por tanto el rendimiento de los sitios
– evitar la creación innecesaria de variables globales que consumen memoria y sobrecargan el código y su procesamiento
– cargar recursos (imágenes, archivos, datos, etc.) solo cuando sean necesarios
– no bloquear el hilo principal: cualquier bloqueo o tiempos de procesamiento prolongados pueden bloquear la interfaz y, por tanto, perjudicar la capacidad de respuesta de su aplicación. Una buena práctica: Web Workers.
– instrumente su código, realice ajustes en tiempo de ejecución con DevTools del navegador