浏览器基础：进程与线程 - 版本历史

2023年3月25日 (六) 00:02 Eijux

2023-03-25T00:02:01Z

←上一版本		2023年3月25日 (六) 08:02的版本
第13行：		第13行：

	== 浏览器进程/线程模型<ref name="">参考：		== 浏览器进程/线程模型<ref name="">参考：
	# [https://developer.chrome.com/blog/inside-browser-part1/ ~~Inside~~ look at modern web browser (part 1)]：描述了Chrome的多进程架构，及不同进程的区别		# [https://developer.chrome.com/blog/inside-browser-part1/ Chrome：《Inside look at modern web browser (part 1)》]：描述了Chrome的多进程架构，及不同进程的区别
	# [https://developer.chrome.com/blog/inside-browser-part2/ ~~Inside~~ look at modern web browser (part 2)]：为展示网站页面，每个进程和线程如何进行通信		# [https://developer.chrome.com/blog/inside-browser-part2/ Chrome：《Inside look at modern web browser (part 2)》]：为展示网站页面，每个进程和线程如何进行通信
	# [https://developer.chrome.com/blog/inside-browser-part3/ ~~Inside~~ look at modern web browser (part 3)]：渲染进程（Renderer Process）的内部工作		# [https://developer.chrome.com/blog/inside-browser-part3/ Chrome：《Inside look at modern web browser (part 3)》]：渲染进程（Renderer Process）的内部工作
	# [https://developer.chrome.com/blog/inside-browser-part4/ ~~Inside~~ look at modern web browser (part 4)]：用户输入时合成器（Compositor）是如何实现平滑交互的		# [https://developer.chrome.com/blog/inside-browser-part4/ Chrome：《Inside look at modern web browser (part 4)》]：用户输入时合成器（Compositor）是如何实现平滑交互的
	</ref> ==		</ref> ==
	浏览器进程架构有两种方案：'''单进程多线程'''和'''多进程（通过IPC传递消息）'''。		浏览器进程架构有两种方案：'''单进程多线程'''和'''多进程（通过IPC传递消息）'''。
第47行：		第47行：
	#* 每个插件都有一个插件进程。		#* 每个插件都有一个插件进程。

	也有说法，当前 Chrome 架构（面向服务的架构）将“'''网络进程'''”、“'''utility进程'''”从“浏览器进程”中独立了出来<ref>参考：[https://zhuanlan.zhihu.com/p/362120843 ~~全面了解「Chrome」的多进程架构~~]、[https://www.cnblogs.com/suihang/p/12718528.html ~~Chrome浏览器架构~~]</ref>，但此处不重要。		也有说法，当前 Chrome 架构（面向服务的架构）将“'''网络进程'''”、“'''utility进程'''”从“浏览器进程”中独立了出来<ref>参考：
			#[https://zhuanlan.zhihu.com/p/362120843 《全面了解「Chrome」的多进程架构》]
			#[https://www.cnblogs.com/suihang/p/12718528.html 《Chrome浏览器架构》]</ref> ，但此处不重要。

	[[File:Different processes pointing to different parts of browser UIavif.png\|600px]]		[[File:Different processes pointing to different parts of browser UIavif.png\|600px]]

2023年3月24日 (五) 23:59 Eijux

2023-03-24T23:59:21Z

←上一版本		2023年3月25日 (六) 07:59的版本
第82行：		第82行：


	'''“排版引擎”（Blink）和“Javascript引擎”（V8）都是运行在“渲染进程”（Renderer Process）中，通过“Event ~~Loop”选择执行~~<ref>参考：[https://juejin.cn/post/6961349015346610184 ~~Event~~ Loop 和 JS ~~引擎、渲染引擎的关系~~]</ref>。'''		'''“排版引擎”（Blink）和“Javascript引擎”（V8）都是运行在“渲染进程”（Renderer Process）中，通过“Event Loop”进协调<ref>参考：[https://juejin.cn/post/6961349015346610184 《Event Loop 和 JS 引擎、渲染引擎的关系》]</ref>。'''

	== '''渲染进程''' ==		== '''渲染进程''' ==

Eijux：/* 关于 */

2023-03-24T23:57:19Z

关于

←上一版本		2023年3月25日 (六) 07:57的版本
第3行：		第3行：
	== 关于 ==		== 关于 ==
	学习 JavaScript 的“事件循环（Event Loop）”机制时，需要结合浏览器的进程、线程相关知识。		学习 JavaScript 的“事件循环（Event Loop）”机制时，需要结合浏览器的进程、线程相关知识。


	关于浏览器的更多知识，参考：		关于浏览器的更多知识，参考：
	# [https://zhuanlan.zhihu.com/p/357572542 ~~浏览器工作原理（各线程介绍）~~]		# [https://zhuanlan.zhihu.com/p/357572542 《浏览器工作原理（各线程介绍）》]
	# [https://juejin.cn/post/6991849728493256741 ~~深入理解浏览器中的进程与线程~~]		# [https://juejin.cn/post/6991849728493256741 《深入理解浏览器中的进程与线程》]
	# [https://juejin.cn/post/7025956944028532743 ~~深入浏览器之页面加载中的计算机网络~~]		# [https://juejin.cn/post/7025956944028532743 《深入浏览器之页面加载中的计算机网络》]
	# [https://juejin.cn/post/7064499913115041806 ~~深入浏览器之浏览器中的进程与线程~~]		# [https://juejin.cn/post/7064499913115041806 《深入浏览器之浏览器中的进程与线程》]
	# [https://juejin.cn/post/7209542304863797308 ~~浏览器进程~~/~~线程模型~~]		# [https://juejin.cn/post/7209542304863797308 《浏览器进程/线程模型》]

	== 浏览器进程/线程模型<ref name="">参考：		== 浏览器进程/线程模型<ref name="">参考：

Eijux：/* 浏览器：内核、引擎参考：Web 浏览器相关的一些概念 */

2023-03-24T23:56:33Z

浏览器：内核、引擎参考：Web 浏览器相关的一些概念

←上一版本		2023年3月25日 (六) 07:56的版本
第50行：		第50行：
	[[File:Different processes pointing to different parts of browser UIavif.png\|600px]]		[[File:Different processes pointing to different parts of browser UIavif.png\|600px]]

	== 浏览器：内核、引擎<ref>参考：[https://keqingrong.cn/blog/2019-11-24-concepts-related-to-web-browsers/#:~:text=Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%E7%9B%B8%E5%85%B3%E7%9A%84%E4%B8%80%E4%BA%9B%E6%A6%82%E5%BF%B5%201%20%E6%B5%8F%E8%A7%88%E5%99%A8%20%E6%9B%B4%E5%87%86%E7%A1%AE%E7%9A%84%E8%AF%B4%E6%98%AF%20Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%EF%BC%8C%E5%8D%B3%20Web,7%20JavaScript%20%E5%BC%95%E6%93%8E%20...%208%20WebView%20...%20%E6%9B%B4%E5%A4%9A%E9%A1%B9%E7%9B%AE ~~Web 浏览器相关的一些概念~~]</ref> ==		== 浏览器：内核、引擎<ref>参考：
			# [https://zhuanlan.zhihu.com/p/350016161 《【译文】扒一扒JavaScript运行时环境》]
			# [https://keqingrong.cn/blog/2019-11-24-concepts-related-to-web-browsers/#:~:text=Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%E7%9B%B8%E5%85%B3%E7%9A%84%E4%B8%80%E4%BA%9B%E6%A6%82%E5%BF%B5%201%20%E6%B5%8F%E8%A7%88%E5%99%A8%20%E6%9B%B4%E5%87%86%E7%A1%AE%E7%9A%84%E8%AF%B4%E6%98%AF%20Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%EF%BC%8C%E5%8D%B3%20Web,7%20JavaScript%20%E5%BC%95%E6%93%8E%20...%208%20WebView%20...%20%E6%9B%B4%E5%A4%9A%E9%A1%B9%E7%9B%AE 《Web 浏览器相关的一些概念》]</ref> ==
	浏览器相关的术语：浏览器内核、浏览器引擎、排版引擎、Js引擎、Blink、v8、webkit……，这都是啥？		浏览器相关的术语：浏览器内核、浏览器引擎、排版引擎、Js引擎、Blink、v8、webkit……，这都是啥？

Eijux：Eijux移动页面浏览器基础：进程模型至浏览器基础：进程与线程，不留重定向

2023-03-23T17:27:22Z

Eijux移动页面浏览器基础：进程模型至浏览器基础：进程与线程，不留重定向

←上一版本	2023年3月24日 (五) 01:27的版本
（没有差异）

Eijux：Eijux移动页面浏览器基础至浏览器基础：进程模型，不留重定向

2023-03-23T17:22:51Z

Eijux移动页面浏览器基础至浏览器基础：进程模型，不留重定向

←上一版本	2023年3月24日 (五) 01:22的版本
（没有差异）

Eijux：创建页面，内容为“category:JavaScript == 关于 == 学习 JavaScript 的“事件循环（Event Loop）”机制时，需要结合浏览器的进程、线程相关知识。关于浏览器的更多知识，参考： # [https://zhuanlan.zhihu.com/p/357572542 浏览器工作原理（各线程介绍）] # [https://juejin.cn/post/6991849728493256741 深入理解浏览器中的进程与线程] # [https://juejin.cn/post/7025956944028532743 深入浏览器之页面加载中…”

2023-03-23T17:22:31Z

创建页面，内容为“category:JavaScript == 关于 == 学习 JavaScript 的“事件循环（Event Loop）”机制时，需要结合浏览器的进程、线程相关知识。关于浏览器的更多知识，参考： # [https://zhuanlan.zhihu.com/p/357572542 浏览器工作原理（各线程介绍）] # [https://juejin.cn/post/6991849728493256741 深入理解浏览器中的进程与线程] # [https://juejin.cn/post/7025956944028532743 深入浏览器之页面加载中…”

新页面

[[category:JavaScript]]

== 关于 ==
学习 JavaScript 的“事件循环（Event Loop）”机制时，需要结合浏览器的进程、线程相关知识。

关于浏览器的更多知识，参考：
# [https://zhuanlan.zhihu.com/p/357572542 浏览器工作原理（各线程介绍）]
# [https://juejin.cn/post/6991849728493256741 深入理解浏览器中的进程与线程]
# [https://juejin.cn/post/7025956944028532743 深入浏览器之页面加载中的计算机网络]
# [https://juejin.cn/post/7064499913115041806 深入浏览器之浏览器中的进程与线程]
# [https://juejin.cn/post/7209542304863797308 浏览器进程/线程模型]

== 浏览器进程/线程模型<ref name="">参考：
# [https://developer.chrome.com/blog/inside-browser-part1/ Inside look at modern web browser (part 1)]：描述了Chrome的多进程架构，及不同进程的区别
# [https://developer.chrome.com/blog/inside-browser-part2/ Inside look at modern web browser (part 2)]：为展示网站页面，每个进程和线程如何进行通信
# [https://developer.chrome.com/blog/inside-browser-part3/ Inside look at modern web browser (part 3)]：渲染进程（Renderer Process）的内部工作
# [https://developer.chrome.com/blog/inside-browser-part4/ Inside look at modern web browser (part 4)]：用户输入时合成器（Compositor）是如何实现平滑交互的
</ref> ==
浏览器进程架构有两种方案：'''单进程多线程'''和'''多进程（通过IPC传递消息）'''。

[[File:Different browser architectures in process／thread-diagram.png|600px]]

# '''单进程多线程'''：顾名思义，浏览器在同一个进程运行所有功能模块（包括篇：网络、插件、JavaScript 运行环境、渲染引擎和页面等）
* 其缺点很明显：
*# 不稳定：任一线程错误，将导致整个进程崩溃
*# 不流畅：同一时刻只有一个浏览器模块可用
*# 不安全：各线程共享进程数据，更容易导致攻击
*# 高占用：进程关闭之前，不会回收由线程占用的资源
* （其实早在 2007 年之前，市面上浏览器都是单进程的）

=== “多进程”模型 ===
现代浏览器多从用'''多进程'''模型，但各家实现细节各有差异。

（以 Chrome 为例）

[[File:Diagram of Chrome’s multi process architecture.png|600px]]

浏览器主要进程，包括：
# '''浏览器进程（Browser Process）'''：控制应用程序的“chrome”部分，包括地址栏、书签、后退和前进按钮。还处理网络浏览器中不可见的特权部分，如网络请求和文件访问。
#* 简单来说：主要负责界面显示、用户交互、子进程管理，同时提供存储等功能。
# '''渲染进程（Renderer Process）'''：控制显示网站的选项卡内的任何内容。
#* '''浏览器会为每个 Tab 标签创建一个渲染进程'''。
#* 出于安全考虑，渲染进程都是运行在沙箱模式下。
# '''GPU进程（GPU Process）'''：处理应用程序的 GPU 任务，并将它们绘制在同一个表面上。
# '''插件进程（Plugin Process）'''：控制网站使用的任何插件。
#* 每个插件都有一个插件进程。

也有说法，当前 Chrome 架构（面向服务的架构）将“'''网络进程'''”、“'''utility进程'''”从“浏览器进程”中独立了出来<ref>参考：[https://zhuanlan.zhihu.com/p/362120843 全面了解「Chrome」的多进程架构]、[https://www.cnblogs.com/suihang/p/12718528.html Chrome浏览器架构]</ref>，但此处不重要。

[[File:Different processes pointing to different parts of browser UIavif.png|600px]]

== 浏览器：内核、引擎<ref>参考：[https://keqingrong.cn/blog/2019-11-24-concepts-related-to-web-browsers/#:~:text=Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%E7%9B%B8%E5%85%B3%E7%9A%84%E4%B8%80%E4%BA%9B%E6%A6%82%E5%BF%B5%201%20%E6%B5%8F%E8%A7%88%E5%99%A8%20%E6%9B%B4%E5%87%86%E7%A1%AE%E7%9A%84%E8%AF%B4%E6%98%AF%20Web%20%E6%B5%8F%E8%A7%88%E5%99%A8%EF%BC%8C%E5%8D%B3%20Web,7%20JavaScript%20%E5%BC%95%E6%93%8E%20...%208%20WebView%20...%20%E6%9B%B4%E5%A4%9A%E9%A1%B9%E7%9B%AE Web 浏览器相关的一些概念]</ref> ==
浏览器相关的术语：浏览器内核、浏览器引擎、排版引擎、Js引擎、Blink、v8、webkit……，这都是啥？

浏览器内核（浏览器引擎）：指“广义上的渲染引擎”（渲染引擎 + JS 引擎）
# '''渲染引擎'''（排版引擎）：负责解析（HTML、CSS、JavaScript 和 DOM），并渲染页面。
#: 如：WebKit、Geck、Blink
# '''JS 引擎'''（JS 虚拟机）：负责解释、执行 JavaScript 代码
#: 如：SpiderMonkey、JavaScriptCore（WebKit 内置）、V8

{| class="wikitable"
|+ 常见浏览器的“渲染引擎”和“JS 引擎”
|-
! 浏览器 !! 渲染引擎 !! JS 引擎
|-
| '''IE''' || Trident（MSHTML） || JScript/Chakra
|-
| '''Edge''' || EdgeHTML || Chakra
|-
| '''Chrome''' || Blink || V8
|-
| '''Firefox''' || Gecko || SpiderMonkey
|-
| '''Safari''' || WebKit || JavaScriptCore
|-
| '''Opera''' || Presto || Carakan
|}

'''“排版引擎”（Blink）和“Javascript引擎”（V8）都是运行在“渲染进程”（Renderer Process）中，通过“Event Loop”选择执行<ref>参考：[https://juejin.cn/post/6961349015346610184 Event Loop 和 JS 引擎、渲染引擎的关系]</ref>。'''

== '''渲染进程''' ==
浏览器的“渲染进程（Renderer Process）”是多线程的，页面的渲染、JS 执行等都在这个进程内进行，其执行机制就是“<span style="color: green; font-size:120%">'''[[Event Loop：事件循环]]'''</span>”。

“渲染进程”中包括以下线程：
# '''GUI 渲染线程'''：负责渲染浏览器界面（解析 HTML、CSS；构建 DOM 树、RenderObject 树；布局、绘制）。
#* 当界面需要重绘（Repaint）或由于某种操作引发回流（reflow）时，该线程就会执行。
#*
# '''JS 引擎线程'''：负责解析处理 JavaScript 任务（包括：“执行栈”、“任务队列”），运行代码。
#* 一个 Tab 页中只有一个“JS 引擎线程”。
# '''事件触发线程'''：负责检测“事件触发”状态。
#: 当事件发条件被触发时，该线程会：把对应事件添加到“事件队列”（宏任务）中，以等待“JS 引擎”执行；
# '''定时触发器线程'''：负责检测“定时器”状态。
#: 当计时完毕后，该线程会：把对应事件添加到“事件队列”（宏任务）中，以等待“JS 引擎”执行；
#* setInterval 与 setTimeout 所在线程。
# '''异步http请求线程'''：负责检测 HTTP 请求状态。
#: 当请求状态变更时，该线程会：把对应事件添加到“事件队列”（宏任务）中，以等待“JS 引擎”执行；
#* 在 XMLHttpRequest/Fetch 连接后，由浏览器创建的线程。

'''“GUI渲染线程”与“JS 引擎线程”互斥'''：

JS 堵塞的原因所在，其目的是：防止渲染出现不可预期的结果（毕竟 JS 是可以操作 DOM 的）。

== 参考 ==
<references/>

浏览器基础：进程与线程 - 版本历史

2023年3月25日 (六) 00:02 Eijux

2023年3月24日 (五) 23:59 Eijux

Eijux：​/* 关于 */

Eijux：​/* 浏览器：内核、引擎参考：Web 浏览器相关的一些概念 */

Eijux：​Eijux移动页面浏览器基础：进程模型至浏览器基础：进程与线程，不留重定向

Eijux：​Eijux移动页面浏览器基础至浏览器基础：进程模型，不留重定向

Eijux：/* 关于 */

Eijux：/* 浏览器：内核、引擎参考：Web 浏览器相关的一些概念 */

Eijux：Eijux移动页面浏览器基础：进程模型至浏览器基础：进程与线程，不留重定向

Eijux：Eijux移动页面浏览器基础至浏览器基础：进程模型，不留重定向