<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:cc="http://cyber.law.harvard.edu/rss/creativeCommonsRssModule.html">
    <channel>
        <title><![CDATA[Stories by Daniel Armas Ramírez on Medium]]></title>
        <description><![CDATA[Stories by Daniel Armas Ramírez on Medium]]></description>
        <link>https://medium.com/@daniel692a?source=rss-3c0751262443------2</link>
        <image>
            <url>https://cdn-images-1.medium.com/fit/c/150/150/1*4pW-kfDClkzRK82UN7agzQ.jpeg</url>
            <title>Stories by Daniel Armas Ramírez on Medium</title>
            <link>https://medium.com/@daniel692a?source=rss-3c0751262443------2</link>
        </image>
        <generator>Medium</generator>
        <lastBuildDate>Sat, 16 May 2026 19:13:25 GMT</lastBuildDate>
        <atom:link href="https://medium.com/@daniel692a/feed" rel="self" type="application/rss+xml"/>
        <webMaster><![CDATA[yourfriends@medium.com]]></webMaster>
        <atom:link href="http://medium.superfeedr.com" rel="hub"/>
        <item>
            <title><![CDATA[Comprendiendo V8]]></title>
            <link>https://daniel692a.medium.com/comprendiendo-v8-7b74bc8b4b08?source=rss-3c0751262443------2</link>
            <guid isPermaLink="false">https://medium.com/p/7b74bc8b4b08</guid>
            <category><![CDATA[v8-engine]]></category>
            <category><![CDATA[web-development]]></category>
            <category><![CDATA[javascript]]></category>
            <category><![CDATA[hoisting]]></category>
            <dc:creator><![CDATA[Daniel Armas Ramírez]]></dc:creator>
            <pubDate>Wed, 14 Apr 2021 01:08:32 GMT</pubDate>
            <atom:updated>2021-07-09T01:16:04.795Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="Just In Time" src="https://cdn-images-1.medium.com/max/1024/1*s_SU-1ky2f38IplaqM4AXg.png" /></figure><p>Puede ser que en el camino del desarrollador web se escuché de <strong>V8, </strong>ya sea en Node.js o Chrome. V8 es un motor de JavaScript de <strong>código abierto, </strong>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.</p><p>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 <strong>V, </strong>como puedes ver en la siguiente imagen<strong>:</strong></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*WyDuvPRHTpR44VhM5rOcTQ.jpeg" /></figure><h3>¿Para qué es un JavaScript Engine?</h3><p>Cuando das indicaciones al navegador por el lenguaje de JavaScript, por ejemplo:</p><pre>console.log(&#39;Happy Hacking&#39;);</pre><p>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 <strong>Byte Code. </strong>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 (<strong>JIT</strong>).</p><h3>Proceso</h3><p>Antes de empezar a traducir nuestro código se debe crear un <strong>global enviroment</strong> (entorno global) que será un objeto principal conocido como <strong>window</strong>, también existe una variable <em>this;</em> <em>this</em> en JavaScript depende mucho del contexto en que sea llamado pero para este caso <em>this,</em><strong> </strong>al ser creado en el entorno global será igual a <strong>window. </strong>Si creas un script vacío, después abres la consola del navegador y escribe <em>this</em> te mostrará el objeto window.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fgiphy.com%2Fembed%2FDyvyiFFXF1Yli%2Ftwitter%2Fiframe&amp;display_name=Giphy&amp;url=https%3A%2F%2Fgiphy.com%2Fgifs%2Fdesusandmero-funny-lol-DyvyiFFXF1Yli&amp;image=https%3A%2F%2Fmedia3.giphy.com%2Fmedia%2FDyvyiFFXF1Yli%2Fgiphy.gif&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=giphy" width="435" height="244" frameborder="0" scrolling="no"><a href="https://medium.com/media/bf046ecd7355a7bb038ede4e55d95e04/href">https://medium.com/media/bf046ecd7355a7bb038ede4e55d95e04/href</a></iframe><p>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.</p><p>Cuando el motor y el navegador interactúan se genera un <em>parseo</em>, 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 <strong>keywords</strong> para crear el AST (Abstract Syntax Tree). Puedes pasar al <a href="https://astexplorer.net/"><strong>siguiente link</strong></a> para comprender sobre este tema.</p><p>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.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/891/1*8l-u2ft-vupI43BvjUHCYQ.png" /></figure><h3>Hoisting</h3><p>Es una parte de “ayuda” por parte del motor, veamos el siguiente ejemplo:</p><pre>console.log(name);<br>var name = &#39;Daniel&#39;</pre><p>Si ejecutas este código probablemente no entiendas el resultado, que será <strong>undefined</strong>, analizando a detalle eso no tiene mucha lógica. ¿Por qué llamarías una variable antes de poder crearla?</p><p>Si ya llevas tiempo con JavaScript o estás iniciando, tal vez te han recomendado no usar <strong>var</strong>, este keyword sufre de hoisting, puedes imaginar que al usar <strong>var</strong> es como tener un globo de helio.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fgiphy.com%2Fembed%2FTGuZwEz6h5cGyMHtOL%2Ftwitter%2Fiframe&amp;display_name=Giphy&amp;url=https%3A%2F%2Fgiphy.com%2Fgifs%2Fhbsc-ballon-TGuZwEz6h5cGyMHtOL&amp;image=https%3A%2F%2Fmedia3.giphy.com%2Fmedia%2FTGuZwEz6h5cGyMHtOL%2Fgiphy.gif&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=giphy" width="435" height="244" frameborder="0" scrolling="no"><a href="https://medium.com/media/3c59811ab265432f634148a9505b9b66/href">https://medium.com/media/3c59811ab265432f634148a9505b9b66/href</a></iframe><p>Los globos de helio flotan y se elevan, algo parecido sucede con <strong>var.</strong> Es como si su declaración se elevara al inicio de nuestro código, algo así:</p><pre>var name = undefined;<br>console.log(name);<br>name = &#39;Daniel&#39;;</pre><p>El engine manda a crear un espacio con el valor <strong>undefined,</strong> que lo lleva a un lugar llamado <strong>Memory Heap</strong>. Este efecto también sucede con el keyword <strong>function </strong>pero de un modo distinto:</p><pre>lastName();<br>function lastName(){<br>	console.log(&#39;Armas&#39;);<br>}</pre><p>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.</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=7b74bc8b4b08" width="1" height="1" alt="">]]></content:encoded>
        </item>
    </channel>
</rss>