This is the 14th day of my participation in Gwen Challenge

preface

Some time ago, I was reading a small pornographic book, which talked about the compilation principle of JS and mentioned the JS engine. Out of curiosity, I want to understand the relevant knowledge. After consulting a large number of information, I will knowledge point induction absorption, there is this article

To make it easier to read, I have divided the article into the following sections

What is a JS engine

About what is JS engine, I think the combination of life examples will be very well understood!

Take the car in life as an example. The car needs to move, and the thing that makes the car move is the engine, such as the V8 engine. Without the engine, it’s just a piece of scrap metal.

And the JS engine is the same thing, the thing that makes JS work.

In order to reflect my professional, I introduce the definition of baidu Encyclopedia

A JavaScript engine is a virtual machine that specializes in processing JavaScript scripts

It can be seen that JS engine is essentially a virtual machine or a program, but this program can deal with our JS code, let us write JS code to move, so as to play the power of the code.

So what exactly does the engine do?

To summarize, the JS engine can compile JS code into assembly code corresponding to different cpus, and is responsible for executing the code, allocating memory, and garbage collection

What are the common JS engines

In fact, this is also my original intention to learn to write an article at the beginning. I looked up a lot of information on the Internet, but found that the articles were old and the time of each engine was chaotic, so I hoped that I could sort them out according to the time line of the engine

The engines are listed below in roughly the order in which they appear

  1. Mozilla’s SpiderMonkey engine is the first JavaScript engine, originally used in Netscape Navigator and now used in Mozilla Firefox. It is implemented in C, and there is a Java version called Rhino; Rhino engine is managed by the Mozilla Foundation, is open source, written entirely in Java and used for HTMLUnit. The TraceMonkey engine is based on real-time compilation and is used in Mozilla Firefox 3.5 to 3.6. JaegerMonkey: Dramatically improved performance with tracking and combination code technology for Mozilla Firefox 4.0 and above

  2. Apple’s JavaScriptCore, or JSC, is open source and used in WebKit-kernel browsers such as Safari. The compiler and bytecode interpreter were implemented in 2008 and upgraded to SquirrelFish. Apple’s internal JavaScript engine code-named Nitro is also based on the JSC engine. As for the timing, JSC is the default JS engine built into WebKit, which was born in 1998 and Nitro was written for Safari 4, which was released in June 2009.

  3. Opera LinearA: Used for Opera4.0 through 6.1, Opera A4 was released in June 2000; LinearB: used for Opera7.0 through 9.2, Opera7 was released in June 2003; Futhark: for Opera9.5 through 10.2, Opera9.5 was released in June 2008; Carakan: for Opera10.5. And above December 2009

  4. Tamarin engine, written by Adobe Labs, used in Flash Player 9, circa June 2006

  5. In September 2008, the first version of Google’s V8 engine was released along with the first version of Chrome. V8 engine written in C++, developed by Google Denmark, open source. In addition to Chrome, it is also used in Node.js and Android operating system

  6. Microsoft Chakra, for Internet Explorer 9, 10, 11, and Microsoft Edge, released in March 2011

  7. JerryScript engine, a small JavaScript engine for embedded devices released by Samsung, opened source in 2015

  8. As of JDK1.8, Nashorn has replaced Rhino(JDK 1.6, JDK1.7) as Java’s embedded JavaScript engine, which was released in 2014

  9. QuickJS engine, released in July 2019

  10. Hermes engine is a new JavaScript engine that Facebook unveiled at Chain React 2019. It is an open source integration engine for mobile React Native applications

Note:

  • The above content is based on extensive data and is not guaranteed to be accurate
  • Since some engines can’t find a specific release date, I will refer to the time when the engine was first used

To understand what a JS engine is, and to comb through common JS engines, let’s take a look at how an engine runs JS code: take V8 for example

How does the V8 engine run JS code

First let’s take a quick look at the V8 engine

About the V8

The V8 engine is written in C++ with Google’s open source JavaScript and WebAssembly engine. The first version of V8 was released with the first version of Chrome on September 2, 2008.

V8 is favored by many people because of its high performance, so it is common

  1. ChromeThe browserJSThe engine isV8
  2. NodejsThe runtime environment of theV8
  3. electronSo is the underlying engineV8

So what exactly does V8 do?

V8 Main Responsibilities

To put it simply, V8 is a system that takes JavaScript code, compiles it, and then executes C++ programs that run on multiple operating systems and multiple processors. Main responsibilities:

  1. Compile and executeJScode
  2. Handling the call stack
  3. Memory allocation
  4. Garbage collection and so on

How does V8 compile and execute JS

How does V8 compile and execute JS code

In general, JS engines use three important components to compile and execute code:

The parser parser

Responsible for parsing JS source code into abstract syntax tree AST as follows:

JS code becomes an AST and you can go to ASTExplorer to see it

The interpreter interpreter

The interpreter is responsible for parsing the AST into bytecodes and can interpret and execute the parsed Bytecode

The compiler compiler

The compiler is responsible for compiling machine code that runs more efficiently

However, in the early days of V8, prior to 5.9, there were no interpreters, but two compilers, which were compiled as follows

  1. parserThe interpreter generates abstract syntax treesAST
  2. compilerThe compilerFull-codegen The benchmark compiler generates the machine code directly
  3. After running for some time, it is optimized by the analyzer threadjscode
  4. compilerThe compilerCrankShaftOptimize the compiler to regenerateASTImprove operating efficiency

Disadvantages of this design

  1. Machine code takes up a lot of memory
  2. Some optimization strategies cannot be implemented due to the lack of intermediate machine code
  3. Not well supported and optimizedJSNew language features, unable to embrace the future

Because of these problems, the new version of V8 has been optimized in terms of flow, as follows

  1. parserParser generationASTAbstract syntax tree
  2. interpreterThe interpreter IgnitiongeneratebyteCodeBytecode and execute directly
  3. removeASTFree up memory
  4. get25% - 50%.The equivalent machine code size of
  5. compiler During execution, the interpreter collects optimization information and sends it to the compilerTurboFan
  6. Regenerate the machine code
  7. Some of the hot function changes are reverted from the optimized machine code to bytecode i.edeoptimizationRoll back the bytecode operation

Point of optimization:

  1. Value declarations are not called and will not be parsedAST
  2. The function is only called once,bytcodeIt is interpreted directly and does not enter the compilation optimization phase
  3. The function is called multiple times,IgnitonFunction type information is collected, may be marked as hot functions, and may be compiled into optimized machine code

Benefits:

  1. Since there is no need to compile directly to machine code initially, the bytecode for the middle layer is generated, saving time
  2. Optimization of the compilation phase, without the need to re-parse from the source code, directly through the bytecode optimization, also can bedeoptimizationfallback

That’s all about THE JS engine this time! If wrong, welcome to leave a message to inform, also welcome to support!

end