Javascript 浏览器中的引擎-它们如何交互？

我一直在试图深入了解Web开发，特别是JavaScript，以及不同引擎如何与JavaScript引擎交互。例如，我知道渲染引擎正在交互、HTTP请求等。我只是想知道，JavaScript引擎何时必须将数据发送到另一个引擎，例如渲染引擎，当数据到达那里时，JavaScript引擎完成了多少计算？

计算机通常每秒能够执行数十亿次计算。但是，渲染线程通常只更新60次（刷新率/VSync），网络请求要慢得多。与等待阻塞相比，将它们卸载到线程更便宜

---

卸载绘图的另一个原因是要使界面看起来简洁：即使JS线程中有长时间运行的东西，卸载的渲染线程仍会像正常情况一样响应。

大致上，它是这样运行的：

• 浏览器获取HTML页面（或发送给它的HTML数据）
• 浏览器开始解释和处理页面
• 在

  head

  部分中，如果它看到任何外部链接文件，例如JavaScript和CSS文件，它会立即启动加载请求
• 如果HTML或链接文件中存在任何JavaScript，则会立即执行JavaScript，除非它利用了较新的

  async

  选项。这就是为什么JavaScript通常包含一个事件处理程序，用于在文档完成加载时处理事件
• 其余的继续

休息一下，请注意，

头

内容在接收时进行处理，而不是稍后

• 从上到下处理

  正文

  内容
• 当这种情况发生时，将创建DOM（文档对象模型-内容的一种映射）
• 呈现HTML可见内容
• 任何附加的外部数据（如图像）都将启动它们自己的下载请求。此内容是并行加载的，而不是等待加载。这就是为什么设计糟糕的HTML通常会导致在加载图像后重新绘制
• 现在加载的CSS同时也被应用

这就是静态内容。如果您有更改内容的JavaScript，还有一个阶段：

• JavaScript可以随时更改文档的内容
• 通常，但并非总是，更改内容会触发重画。如果更改影响布局，则需要执行此操作
• JavaScript还可以更改HTML元素的单个CSS样式。同样，这可能会触发重新绘制

---

Web是一个标准化的平台，运行在应用程序层
它是一个超媒体系统，由协议（HTTP）、标记语言、样式语言（CSS）和浏览器API（Web API）组成
Web是在早期超媒体系统（如HyperCard）的基础上开发的，它使用类似的单线程、面向事件的渲染过程
您的问题的关键是“浏览器的各个部分如何交互以呈现网页？”
答案是由W3C和WHATWG标准机构定义的供应商特定实施和标准化行为的混合体
高级别的渲染过程可能如下所示：
入站消息通过操作系统的网络子项（该网络子项反过来通过TCP IPS传输层接收该流）作为使用UTF-8编码的字节流公开给浏览器应用程序
因此，浏览器的网络子系统接收入站UTF-8编码的八位字节流
浏览器可能会在线程或进程上处理入站字节流，而不是协调UI呈现以避免锁定浏览器
浏览器理解1989年发明的基于文本的Tim Berners-Lee，并将入站字节解释为HTTP消息
消息体将与页面的标记相对应。一旦收到页面标记，它将被交给线程进行呈现
从标记的顶部开始，浏览器呈现过程将根据W3C/定义的算法开始解析
当遇到JavaScript时，它通常会立即运行，但在遇到JavaScript时会发生什么，有复杂的规则
当遇到对资源（如图像、脚本、样式表）的引用时，将请求下载这些资源。有些会阻止渲染过程，有些则不会
当遇到一段JavaScript时，它的计算通常会阻塞用户界面。这是因为Web被设计为具有控制页面呈现的单个执行线程，JavaScript是该过程的一部分。据我所知，多线程用户界面渲染系统是不寻常的，因为它们的复杂性（尽管我可能在这方面错了）
因此，浏览器将从标记（或链接的脚本资源）中提取JavaScript，并将其交给JavaScript引擎进行评估。JavaScript运行时是一个能够对基于堆栈的语言进行评估的应用程序。它有一个堆栈、堆和逻辑，用于将JavaScript脚本转换为CPU可以理解的形式
堆栈上有零个或多个堆栈帧。在JavaScript堆栈中，帧称为执行上下文。执行上下文就像书中的书签，它帮助运行时跟踪脚本执行的位置。只有当堆栈中没有执行上下文时，浏览器才能继续其渲染工作——因此，是的，运行JavaScript通常会阻止渲染
不同浏览器子系统（网络、JavaScript运行时、渲染）之间的通信将通过分配给浏览器进程的堆进行，或者如果