Comprendiendo V8

Puede ser que en el camino del desarrollador web se escuché de V8, ya sea en Node.js o Chrome. V8 es un motor de JavaScript de código abierto, no es el único que existe, pero si es uno de los más adoptados debido a su alta velocidad que se vio necesaria para el desarrollo de Google Maps.

Google Maps es una aplicación muy grande que por detrás debía correr muchas cosas, causando una carga lenta en otros navegadores, por suerte llegó V8 para demostrar que JavaScript no es lento. Por cierto, su nombre se debe a la identificación con los motores V8 de los automóviles que son montados en el cárter con dos bancos de cuatro cilindros, que comparte cigüeñal formando una V, como puedes ver en la siguiente imagen:

¿Para qué es un JavaScript Engine?

Cuando das indicaciones al navegador por el lenguaje de JavaScript, por ejemplo:

console.log('Happy Hacking');

Si abrimos la consola del navegador podremos visualizar el mensaje, pero para mostrar esto se necesita de un proceso debido a que las computadoras no entienden lenguajes de programación, pero sí entienden Byte Code. Para ello es necesario contar con una herramienta que traduzca el código JavaScript a Byte Code, ahí es donde entra el engine que se encuentra en el navegador para que cuando llegue el script se lo pase y empiece a traducirlo, ese proceso se le conoce como Just In Time Compiler (JIT).

Proceso

Antes de empezar a traducir nuestro código se debe crear un global enviroment (entorno global) que será un objeto principal conocido como window, también existe una variable this; this en JavaScript depende mucho del contexto en que sea llamado pero para este caso this, al ser creado en el entorno global será igual a window. Si creas un script vacío, después abres la consola del navegador y escribe this te mostrará el objeto window.

Bien, ya tenemos el entorno global ¿ahora qué? Pasamos al contexto de ejecución, que es donde ya empieza a correr nuestro código por medio de un Stack o pila de tareas.

Cuando el motor y el navegador interactúan se genera un parseo, eso significa analizar y convertir un script a un un formato interno que un entorno de ejecución pueda comprender, esto ayuda a encontrar las keywords para crear el AST (Abstract Syntax Tree). Puedes pasar al siguiente link para comprender sobre este tema.

Al tener el AST lo lleva a interpretar para dar el machine code pero existe un paso en que, al analizar el árbol, el intérprete se da cuenta que hay mucho código que puede optimizar, ahí entra el profiler que también se le conoce como monitor, este paso resulta de gran importancia porque aquí sucede el Hoisting.

Hoisting

Es una parte de “ayuda” por parte del motor, veamos el siguiente ejemplo:

console.log(name);
var name = 'Daniel'

Si ejecutas este código probablemente no entiendas el resultado, que será undefined, analizando a detalle eso no tiene mucha lógica. ¿Por qué llamarías una variable antes de poder crearla?

Si ya llevas tiempo con JavaScript o estás iniciando, tal vez te han recomendado no usar var, este keyword sufre de hoisting, puedes imaginar que al usar var es como tener un globo de helio.

Los globos de helio flotan y se elevan, algo parecido sucede con var. Es como si su declaración se elevara al inicio de nuestro código, algo así:

var name = undefined;
console.log(name);
name = 'Daniel';

El engine manda a crear un espacio con el valor undefined, que lo lleva a un lugar llamado Memory Heap. Este efecto también sucede con el keyword function pero de un modo distinto:

lastName();
function lastName(){
	console.log('Armas');
}

Al correr este código funcionará tal y como escribí, porque el hoisting funciona así: lastName es una función pero el motor no sabe que realizar, se envía al Memory Heap para seguir analizando y después cuando vea lo que hace, la ejecuta. Todo esto sucede en el proceso del Profiler o Monitor.