Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”. This article has participated in the “Digitalstar Project” and won a creative gift package to challenge the creative incentive money.
I recently relearned how browsers render web pages, and learned a little about the V8 engine that executes JAVASCRIPT code used in Chrome and Node. The main text is nearly 2000 words, so it is divided into two parts, the first part mainly introduces the browser rendering process, the next part mainly introduces the V8 engine. If you have any inadequacies or suggestions, you are welcome to correct them
V8 engine
V8 is a javascript and webAssembly engine written in C++ for Chrome, NodeJS and more. Note that V8 is just a name, not a series like V7, V6, etc. In Chrome, V8 engine, through a series of steps, we write js code (high-level language) into the CPU can run machine instructions, the steps are roughly as follows:
1. Parser
After obtaining JS source code, V8 engine first conducted encoding conversion, and then generated tokens through Scanner for lexical analysis, and then sent it to Parser for syntax analysis to generate abstract syntax tree (AST). As for what an abstract syntax tree is, it is a coincidence that I have a previous article on this topic, please refer to AST Abstract syntax tree.
For example, a simple variable declaration:
const msg = 'Hello Juejin'
Copy the codeThe resulting abstract syntax tree looks something like this:
Note: There is also a concept called PreParser. Parsing functions into AST that do not need to be executed immediately on their first run wastes performance, and V8 engines use Lazy Parsing to parse only what is temporarily required. Full parsing of a function is not performed until the function is called.
2. Ignition
The GENERATED AST is converted to byte-code using the Ignition module in the V8. Bytecode is a binary file containing an executable, consisting of a sequence of OP code/data pairs, which is intermediate code. The reason to convert to bytecode rather than directly to machine code is that different platforms (Windows /Linux, etc.) recognize different machine code by their respective cpus. It’s much more efficient to convert the AST directly to machine code that can run on all cpus than to the bytecode that the V8 engine has agreed to run across platforms, and then convert it to different CPU instructions depending on the platform.
Note: bytecode is translated into assembly language and then into machine language.
3. TurboFan
TurboFan modules are also used when V8 engines compile JS, which optimizes bytecode directly into machine code and deoptimizes it back into bytecode when needed. For example, the Ignition module collects information that a function method will be executed multiple times, and that function will be marked as a hot function by Ignition. Convert this function to machine code by TurboFan and save it to run the next time you execute it. However, if the parameter type of the function is converted the next time it is executed, such as a + B, a and B are both numbers at the beginning, and the converted machine code performs the operation of adding numbers. Later, a and B become strings, and the + performs the operation of concatenating strings, the original machine code will not be used. Need to de-optimize back to bytecode to continue execution. Therefore, when executing functions, it is best not to have different types of arguments. (Ts compiled code executes faster at this point)
graphic
The above content can be summarized as a flow chart, as follows:
