2024最新版JavaScript逆向爬虫教程-------基础篇之深入JavaScript运行原理以及内存管理

目录

• https://developer.mozilla.org/zh-CN/docs/Web/Performance/How_browsers_work

  https://baike.baidu.com/item/%E6%B5%8F%E8%A7%88%E5%99%A8%E5%86%85%E6%A0%B8/10602413
  https://zhuanlan.zhihu.com/p/99777087

  https://blog.51cto.com/u_12970/6565469
  https://www.jianshu.com/p/4e0205726fb5

  浏览器内核和 JavaScript 引擎的关系? 浏览器内核和 JavaScript 引擎是浏览器中两个不同但密切相关的组件，它们共同负责解析和执行网页中的 JavaScript 代码，但其功能和职责略有不同。浏览器内核： 浏览器内核是浏览器的核心组件之一，负责解析 HTML、CSS 和 JavaScript 等网页内容，并将其呈现给用户。浏览器内核通常包括渲染引擎(用于解析和渲染 HTML、CSS) 和 JavaScript 引擎。不同的浏览器使用不同的内核，例如：

  • WebKit：用于 Safari 浏览器和一些其他浏览器（如早期版本的 Chrome 和 Opera）。
  • Blink：是基于 WebKit 的一个分支，目前用于 Chrome 浏览器和大多数基于 Chromium 的浏览器。
  • Gecko：用于 Firefox 浏览器。
  • Trident：用于早期版本的 Internet Explorer 浏览器。
  • EdgeHTML：用于 Edge 浏览器的早期版本。

  JavaScript 引擎： JavaScript 引擎是解析和执行 JavaScript 代码的组件。它负责将 JavaScript 代码转换为计算机可执行的指令，并在运行时处理变量、函数、对象等。常见的 JavaScript 引擎包括 V8、SpiderMonkey、JavaScriptCore 等。在浏览器内核中，JavaScript 引擎负责处理网页中的 JavaScript 代码，以便在用户的浏览器中执行。虽然浏览器内核通常包括 JavaScript 引擎，但它们并不是同一个概念。浏览器内核还包括其他组件，如渲染引擎、网络模块等，而 JavaScript 引擎专门负责处理 JavaScript 代码的执行。在大多数现代浏览器中，JavaScript 引擎是浏览器内核中的一个重要组成部分，负责执行网页中的 JavaScript 代码，从而实现交互性和动态性。 以 WebKit 为例，参考文章：https://blog.csdn.net/qq_44918090/article/details/131640533 在小程序中编写的 JavaScript 代码就是被 JSCore 执行的：
  

  AST Explorer 工具：AST 在前端应用场景特别多，比如将 TypeScript 代码转成 JavaScript 代码、ES6转ES5、还有像 Vue 中的 template 等，都是先将其转换成对应的 AST，然后再生成目标代码；参考官方文档：https://v8.dev/blog/scanner

  ② Ignition 模块： 一个解释器，可以将 AST 转换成 ByteCode(字节码)。字节码(Byte-code)：是一种包含执行程序，由一序列 op 代码/数据对组成的二进制文件，是一种中间码。将 JS 代码转成 AST 是便于引擎对其进行操作，前面说到 JS 代码最终是转成机器码给 CPU 执行的，为什么还要先转换成字节码呢？因为 JS 运行所处的环境是不一定的，可能是 Windows 或 Linux 或 iOS，不同的操作系统其 CPU 所能识别的机器指令也是不一样的。字节码是一种中间码，本身就有跨平台的特性，然后 V8 引擎再根据当前所处的环境将字节码编译成对应的机器指令给当前环境的 CPU 执行。参考官方文档：https://v8.dev/blog/ignition-interpreter

  ③ TurboFan 模块： 一个编译器，可以将字节码编译为 CPU 认识的机器码。在了解 TurboFan 模块之前可以先考虑一个问题，如果每执行一次代码，就要先将 AST 转成字节码然后再解析成机器指令，是不是有点损耗性能呢？强大的 V8 早就考虑到了，所以出现了 TurboFan 这么一个库；TurboFan 可以获取到 Ignition 收集的一些信息，如果一个函数在代码中被多次调用，那么就会被标记为热点函数，然后经过 TurboFan 转换成优化的机器码，再次执行该函数的时候就直接执行该机器码，提高代码的执行性能；图中还存在一个 Deoptimization 过程，其实就是机器码被还原成 ByteCode，比如，在后续执行代码的过程中传入热点函数的参数类型发生了变化(如果给 sum 函数传入 number 类型的参数，那么就是做加法；如果给 sum 函数传入 String 类型的参数，那么就是做字符串拼接)，可能之前优化的机器码就不能满足需求了，就会逆向转成字节码，字节码再编译成正确的机器码进行执行；从这里就可以发现，如果在编写代码时给函数传递固定类型的参数，是可以从一定程度上优化我们代码执行效率的，所以 TypeScript 编译出来的 JavaScript 代码的性能是比较好的；参考官方文档：https://v8.dev/blog/turbofan-jit