DEV Community 👩‍💻👨‍💻

Cover image for JavaScript Engine ⚙️💛
Martin
Martin

Posted on

JavaScript Engine ⚙️💛

JavaScript es un lenguaje de programación que puede ser ejecutado en varios entornos:

  • Browsers
  • Servers
  • Mobile applications
  • IoT
  • Desktop applications
  • Serverless functions

The origin

El entorno desde el cual todo comenzó, el entorno del cual otros entornos han tomado ideas es el browser. El browser proporciona varios conceptos y APIs, en la siguiente imagen puede apreciarse la infraestructura del browser y node.js, dos entornos muy populares de JS.

Alt Text

Browser

Cada Browser está desarrollado en diferentes lenguajes, e.g.:

  • 🔰 Chrome: C, C++ y python, entre otros.
  • 🦊 Firefox: C, C++, Rust, entre otros.

Con ellos construyen su backend de programa, que está formado por varias partes, una de ellas es el JS engine ⚙️💛

JS Engine ⚙️💛

El JS engine es la pieza clave de los browsers para que JS pueda ser ejecutado, pero no existe un solo motor, existen varios:

  • 🔰 Chrome y 🎭 Opera utilizan el V8 engine 🎱
  • 🦊 Firefox utiliza Spidermonkey engine 🕷️🐒
  • 🗡️ Edge usa Chakra engine 🙏

ECMACScript

Cada JS engine es mantenido y actualizado ♻️ por un equipo de desarrolladores 👩‍💻 que se encargan de entre otras cosas, agregar las nuevas características del lenguaje que son lanzadas por el comité ECMACScript de forma anual.
Desde el momento que es lanzada una nueva feature del lenguaje hasta que sea soportada por los browser hay un tiempo. Por lo que hay que estar atentos al soporte que de cada uno si querés hacer uso de nuevas features, el siguiente link es útil para esto.

Conclusión

Hemos aprendido sobre la existencia del varios motores (engines) de JS y su importancia para ejecutar codigo JS en los navegadores, pero no solo en este entorno, sino tambien en los demas me falto decirte, el entorno de node.js esta contruido con el motor 🎱 V8 de Chrome 🔰, increible no? Al ocupar algunos de los navegadores mencionados hubo uno de estos motores haciendo que la pagina que visitaras fuera interactiva.

YAPA

Como llegaste hasta aquí, quisiera darte un último concepto para que te lo lleves contigo y su significado también. El concepto es transpiladores. Pero antes de decirte su significado o para que sirve, mejor te doy el problema.

Cuando mencione que seguro vas a estar ansioso de probar las nuevas características de JS apenas salieran, pero habría que esperar un tiempo hasta que el equipo de desarrolladores de los motores de JS lo implementaran en una nueva versión del motor. Bueno, los usuarios no están muy ansiosos por esto, es más, lo desconocen, y suelen no tener los navegadores actualizados por varios motivos. Entonces uno como desarrollador puede estar desarrollando su aplicación web con las últimas características del lenguajes, pero estas pueden no ser soportadas por el navegador del usuario el cual no puede entender esa nueva feature y hacer que nuestra aplicación web se rompa.

¿Qué hacemos entonces? Seguimos con el código viejo de JS? No tiene sentido no? Para solucionar esto existen los transpiladores que nos permiten escribir código JS con las características de JS que queramos y hacer código equivalente o similar en el caso de no ser posible, para que navegadores más viejos puedan correr nuestra aplicación.
Lo transpiladores más conocidos son:

y también te comparto un temita, ¡que andes bien!

Top comments (2)

Collapse
 
jdreina7 profile image
Parcival

Excelente aporte, gracias!

Collapse
 
martinnacimiento profile image
Martin Author

Me alegra mucho, de nada! 😄

Visualizing Promises and Async/Await 🤯

async await

☝️ Check out this all-time classic DEV post