阅读本篇文章后，您可以掌握以下几个方面：JavaScript执行原理；浏览器内核的真实结构；浏览器渲染引擎的工作过程；V8引擎浏览器的工作原理；浏览器与Node.js架构的区别与实践；Node.js架构的应用场景和REPL；Node.js架构的REPL的使用；，为了满足Node.js。之后，我会每周维护1~2篇Node.js文章。欢迎大家和我一起学习大前端进阶系列。标题中提到的V8引擎，大家自然会想到Node.js。我们先来看看Node.js的官方定义：Node.js是一个基于V8JavaScript引擎的JavaScript运行环境。但是，这句话对于我们很多同学来说，是很笼统的。是JavaScript运行环境吗？为什么JavaScript需要特殊的运行环境？什么是JavaScript引擎？什么是V8？学生对以上问题大体理解无所谓。本文将依次揭晓答案~我们先理清这些概念，再看看Node是什么？为什么大前端需要它。JavaScript无处不在StackOverflow的创始人之一JeffAtwood在几年前提出了著名的阿特伍德定律：任何可以用JavaScript实现的应用程序最终都将用JavaScript实现。在发明的时候，JavaScript的目的是在浏览器中执行简单的脚本任务，对浏览器和浏览器中的DOM进行各种操作，因此JavaScript的应用场景非常有限。但是随着Node的出现，阿特伍德定律越来越被证明是正确的。但是为了理解Node.js如何帮助我们做到这一点，我们必须理解JavaScript是如何执行的。现在我们想一想JavaScript代码在浏览器中是如何执行的？不同的浏览器有不同的内核组件：Gecko：早期被Netscape和MozillaFirefox浏览器使用；Trident：微软开发，IE4~IE11浏览器使用，但Edge浏览器已经转向Blink；Webkit：苹果基于KHTML开发，开源，在Safari中使用，谷歌Chrome之前也用过；Blink：Webkit的一个分支，由谷歌开发，目前用于谷歌Chrome、Edge、Opera等；etc...其实我们常说的浏览器内核是指浏览器的布局引擎：layoutengine，又称浏览器引擎、页面渲染引擎或模板引擎。介绍完浏览器的排版引擎，再介绍一下浏览器渲染引擎的工作过程。渲染引擎的工作流程浏览器渲染引擎的工作流程如上图所示：HTML和CSS经过相应的Parser解析后，会形成相应的DOMTree和CSSTree；它们被追加合成后，会形成一个RenderTree，同时会生成一个RenderTree。Layout布局，最后通过浏览器的渲染引擎帮我们完成绘制，呈现出我们平时看到的Hmtl页面；在HTML解析过程中，如果遇到，就会停止解析HTML，优先加载并执行JavaScript代码（这个过程由JavaScript引擎完成）。因为JavaScript是一种高级语言（Python、C++、Java），JavaScript引擎会先把它转成汇编语言，再把汇编语言转成机器语言（二进制010101），最后交由CPU执行。JavaScript引擎为什么需要JavaScript引擎？其实我们写的JavaScript不管是浏览器执行的还是Node执行的，最终都需要CPU执行；但是CPU只懂自己的指令集，其实就是机器语言，CPU可以执行；所以我们需要JavaScript引擎帮助我们将JavaScript代码翻译成CPU指令执行；比较常见的JavaScript引擎有哪些？SpiderMonkey：第一个JavaScript引擎，由BrendanEich（也就是JavaScript的作者）开发；Chakra：微软开发，用于IT浏览器；JavaScriptCore：WebKit中的JavaScript引擎，由Apple开发；V8：谷歌开发的强大的JavaScript引擎，也帮助Chrome从众多浏览器中脱颖而出；上面我们介绍了JavaScript引擎和浏览器核心，但是有同学要问他们有什么联系和区别吗？下面，我以WebKit核心为例。实际上，WebKit内核由两部分组成：WebCore：负责HTML的解析、布局、渲染等；JavaScriptCore：解析和执行JavaScript代码（JavaScript引擎工作）。另一个强大的JavaScript引擎是V8引擎。V8引擎先来看看官方对V8引擎的定义：支持的语言：V8是谷歌开源的用C++编写的高性能JavaScript和WebAssembly引擎，用于Chrome、Node.js等；（译：V8可以运行JavaScript和WebAssembly引擎编译的汇编语言等）跨平台：它实现了ECMAScript和WebAssembly，运行在Windows7或更高版本、macOS10.12+和使用x64、IA-32的Linux系统上，ARM或MIPS处理器；嵌入式格式：V8可以独立运行，也可以嵌入到任何C++应用程序中；说明了V8发动机的工作原理。说明了V8发动机的工作原理。)、TurboFan（优化编译器）**是V8引擎的内置模块。如果有这样一段JavaScript源码：console.log("helloworld");functionsum(num1,num2){returnnum1+num2;}ParseJavaScript代码被转换成AST（抽象语法树），因为解释器并不能直接理解JavaScript代码；如果函数没有被调用，则不会被转换成AST；Parse的V8官方文档：https://v8.dev/blog/scannerIgnition是一个将AST转换为ByteCode（字节码）的解释器；同时收集TurboFan优化所需要的信息（比如函数参数的类型信息，只有有了类型才能进行真正的操作）；如果该函数只被调用一次，Ignition将解释并执行ByteCode；Ignition的V8官方文档：https://v8.dev/blog/ignition-interpreterTurboFan是一个编译器，可以将字节码编译成CPU可以直接执行的机器码；如果某个函数被多次调用，则将其标记为热函数，然后通过TurboFan将其转换为优化后的机器码，以提高代码的执行性能；但是，机器码实际上会恢复为字节码，这是因为如果在函数后续执行过程中类型发生变化（例如求和函数number本来是按number类型执行的，后来按string类型执行），之前优化过的机器码无法正确处理运算，会逆向转换成字节码；TurboFan的V8官方文档：https://v8.dev/blog/turbofan-jit以上是JavaScript代码的执行过程。事实上，V8的内存回收是它强大的另一个原因；Orinoco模块负责垃圾回收，回收程序中不需要的内存；Orinoco的V8官方文档：https://v8.dev/blog/trash-talk关于V8引擎的垃圾内存回收机制，可以看我之前编译的这篇文章《经典升华》V8引擎的垃圾内存回收机制将编程语言大致分为两类：解释型语言：运行效率相对较低（如JavaScript）编译型语言：运行效率相对较高（如C++）以上情况对应的是解释型JavaScript的一般执行过程语言，但编译语言往往没有，比如C++。例如，系统中的某些应用程序是用C++编写的。它们在执行时，会直接转换成机器语言（二进制格式010101），交给CPU统一执行。这样的运行效率自然是比较高的。但是V8也对解释型编程语言进行了优化，也就是上面提到的TurboFan优化编译器。如果一个JavaScript函数被多次调用，它将被TurboFan捕获为优化的机器代码。交给CPU执行，提高代码的执行性能。回顾：什么是Node.js回顾：Node.js的官方定义：Node.js是一个基于V8JavaScript引擎的JavaScript运行环境。也就是说，Node.js是基于V8引擎执行JavaScript代码的，但不仅仅是V8引擎：我们前面了解到，V8可以嵌入到任何C++应用程序中，无论是Chrome还是Node.js，实际上它是内嵌V8引擎，执行JavaScript代码；但是在Chrome浏览器中，还需要解析和渲染HTML、CSS等相关的渲染引擎。另外，还需要提供支持浏览器操作的API，以及浏览器自带的事件循环。它是由浏览器内核为我们完成的；此外，在Node.js中，我们还需要进行一些额外的操作，如文件系统读写、网络IO、文件的加密、压缩和解压等。PS：在后面的文章中，我，我将带领你一步步探索Node.js的世界...ThedifferencebetweenbrowserandNode.jsarchitectureAbriefcomparisonofdifferencebetweenbrowserarchitecture:浏览器和Node.js架构的区别在Chrome中浏览器，比如发送网络请求，中间层会调用操作系统中的网卡；读取一些本地文件，中间层会调用操作系统中的硬盘；对于浏览器页面的渲染，中间层会调用操作系统中的显卡；V8引擎只是其中的一小部分，用于辅助JavaScript代码的运行；还有一些浏览器内核，负责HTML的解析、布局、渲染等；中间层和操作系统（网卡/硬盘/显卡...）；Node中的V8引擎；中间层（libuv）包括EventLoop等；操作系统（网卡/硬盘/显卡……）；Node.js架构先看一张单机的Node.js架构图：我们写的JavaScript代码会通过V8引擎，然后通过Node.jsBindings（Node.jsAPI），将任务派发给Libuv的事件循环;libuv提供了事件循环、文件系统读写、网络IO、线程池等；libuv是一个用C语言编写的库；具体的内部代码执行过程，我会在后面的文章中讲解Node.js中的事件队列机制和异步IO的原理；Node.jsArchitectureDiagramNode.js应用场景Node.js的快速发展也让企业对Node.js技术的关注度越来越高。那么它有哪些实际应用场景呢？目前前端开发库都是以节点包的形式进行管理；npm和yarntools已经成为前端开发使用最多的工具；越来越多的公司使用Node.js作为Web服务器开发；大量项目需要用Node.js完成前后端渲染的同构应用；许多公司正在使用Electron开发桌面应用程序；Node.jsREPL什么是REPL？感觉挺高大上的。REPL是Read-Eval-PrintLoop的缩写，译为“读取-求值-输出”循环；REPL是一个简单的交互式编程环境；事实上，我们浏览器的控制台可以把它看成是一个REPL。Node还为我们提供了一个REPL环境，我们可以在其中浏览简单的代码。浏览器的REPLNode的REPL
