Javascript History

Brendan Eich (who was working for netscape) created first JS engine. Ecmascript standaradized JS. JavaScript was first released in 1995 and confirms to ECMAScript (ES) specification.

There was a big fight between Microsoft Internet explorer and Netscape browsers to gain market share. So Microsoft reverse engineered JavaScript and created own implementation called as JScript. Netscape browser was later redesigned and renamed to Mozilla Firefox.

Here is the timeline of JavaScript.
  • 1995 - First released
  • 2009 - ES5 released
  • 2015 - ES6 released
  • 2016 - ES7 released
  • 2017 - ES8 released
  • 2018 - ES9 released
  • 2019 - ES10 released
ES6 and onward specifications provide many new features but some browsers will not support new features. In such scenario, we use transpiling and polyfill to write code in newer version and then that code is converted into older specification. Each browser has a javascript engine that is used to execute the JavaScript code.
  • Chrome - V8 - fastest JS engine - born in 2008
  • IE/Edge - Chakra was being used in the beginning but In 2020, edge started using Blink and V8 engines
  • Firefox - Spidermonkey
  • opera - carakan
  • Safari - JavaScript Core - webkit
JS can be executed outside of browser.
  • JDK - Nashom JS runtime
  • NodeJS/Deno - It uses V8 JS runtime
  • Bun - It uses JavaScript core - webkit runtime

JavaScript compilation process

Js was interpreted language and had no optimization. Modern JS engine comes with Compiler that can do optimization. e.g. V8 uses JIT - just in time compilation. here are the steps of compilation for Chrome 59+.
  • Parser will parse the JS source code
  • AST - Abstract Syntax Tree is created
  • Ignition Interpreter will interpret the AST and create a byte code
  • Turbofan compiler will compile the bytecode and create optimized machine code which is then executed by CPU.

JS runtime architecture

JS runtime environment consists of 3 parts - engine, web API, event loop polling message queue.
  • Javascript engine contains stack and heap. Objects and closures are stored on heap. JS engine contains single call stack because JS is single threaded language. Recursive function that do not retun will cause call stack overflow error.
  • Web api include dom manipulation, XMLHttpRequest, setTimeout, setInterval etc. Whenever JS engine encounters these web apis, task is delegated to separate threads. When the event is triggered, callbacks are pushed to macro queue (e.g. setTimeout, onClick event) or microtask queue (e.g. fetch promise).
  • Event loop is constantly polling message queue(callback queue) and microtask queue and as soon as JS engine is free, it will ask JS engine to execute these tasks in FIFO order. MicroTask Queue has higher priority than Macro Task Queue.

Web development and Automation testing

solutions delivered!!