JS V8 Engine - ryantc94/Knights-of-Arthur GitHub Wiki

https://blog.sessionstack.com/how-javascript-works-inside-the-v8-engine-5-tips-on-how-to-write-optimized-code-ac089e62b12e

JavaScript Engine

  • JS Engine: a program or interpreter (huh???) that executes JS code, it can be implemented as a standard interpreter or a just-in-time compiler that compiles JS to bytecode. The engine consists of 2 main parts the Memory Heap and Call Stack

V8 Engine

  • V8 Engine: built by Google and written in C++, it's a popular JS engine used by Chrome and NodeJS.
    The engine uses a just-in-time compiler to compile JS to Machine Code during runtime, so it avoids the need for an interpreter to produce bytecode increasing its efficiency.

V8 History

  • Before version 5.9 of V8 Engine, it used two compilers:
  1. Full-CodeGen (simple fast compiler that generates slow machine code)
  2. Crankshaft (a JIT Compiler)
  • V8 Engine uses multiple threads under the hood, main thread reads -> compiles -> executes code, separate threads compile and optimize code, a Profiler thread (???) will during runtime determines which code is time consuming so Crankshaft can optimize it, and other threads to garbage collect.
  • When executing JS code, V8 Engine will first compile code with Full-CodeGen which compiles the JS to Machine Code in order to quickly begin execution and bypassing the need for an interpreter.
  • After code has run for some time the Profiler thread will determine which methods should be optimized. Then Crankshaft will starting optimizing on a separate thread, translating the JS Abstract Syntax Tree to a high-level Static Single-Assignment (SSA) called Hydrogen and tries to optimize the SSA graph.
  • The first optimization is Inlining as much code as possible.
Hidden Classes
  • JS is a prototype based Dynamic Language (a language where object properties can be added/removed during after instantiated)
  • Most JS interpreters use hash function based dictionary like structures to store the location of object property values in memory, which is more computationally expensive than a non-dynamic programming language i.e Java/C#.

Runtime

  • Many APIs in the browser (i.e setTimeOut) are not provided by the JS Engine, they are actually part of the Web API

Call Stack

  • JS is single threaded so it has a single Call Stack, which is a data structure that stores the state of the program, and each entry in Call Stack is called a Stack Frame.
function multiply(x, y) {
    return x * y;
}
function printSquare(x) {
    var s = multiply(x, x);
    console.log(s);
}
printSquare(5);

  • When an Error occurs the browser returns an error and the current state of the stack to trace the bug
  • When a Call Stack cannot contain any more information the browser also throws an error

Concurrency and Event Loop

  • When something in the Call Stack takes to long to process this prevents the browser from responding or doing other tasks (remember Chrome uses V8 engine). If the task takes too long to process the browser may decide to terminate the program.

Glossary

Compiler Dynamic Language Intepreter Profiler Theader
Machine Code JS Abstract Syntax Tree Stating Single Assignment Hydrogen Inlining: the process of replacing a call site (line of code where function is called) with the body of a called function. (How does inlining help optimize code???)

Notes

Refresh on memory stuff (CSO ... basically refresh CSO)