浏览器内核即浏览器底层最核心和最基础的那一部分,它主要负责对网页当中的 html
、 css
、 JavaScript
进行解释然后在浏览器当中进行渲染最终呈现给用户,也就是说内核的工作就是渲染,所以我们常常把浏览器内核称为 渲染引擎
(Rendering Engine)也称为 布局引擎
(Layout Engine)、 排版引擎
。
另外,由于不同浏览器的渲染内核不同,对 html
、 css
、 JavaScript
的语法解释也存在差异(兼容问题),因此我们在开发过程中需要在不同内核的浏览器当中进行网页渲染效果的测试。
五大主流浏览器分别为:IE,火狐(Firefox),谷歌(Chrome),Safari,Opera
四大内核分别是:Trident,Webkit,Blink,Gecko
浏览器 | 内核 |
---|---|
Chrome | Blink |
FireFox | Gecko |
Safari | Webkit |
Opera | Blink |
IE | Trident |
我想说的是:浏览器内核对页面的渲染,其实就是浏览器的渲染进程即Renderer进程。该进程拥有多个线程,这些线程共同来完成页面的渲染任务。那么都有哪些线程呢,如下:
GUI渲染线程
和 JavaScript引擎线程
是互斥的(不会同时执行的),即当 JavaScript引擎线程
执行时 GUI线程
会被冻结,GUI更新需要等到 JavaScript引擎线程
空闲时,才会执行。JavaScript
脚本。JavaScript引擎线程
运行 JavaScript脚本
。(JS是单线程的)GUI渲染线程
与 JavaScript引擎线程
是互斥的,所以如果 JS
执行的时间过长,会造成页面的渲染不连贯,甚至渲染加载阻塞。setTimeout
和 setInterval
所在的线程。JavaScript引擎
是单线程的,如果处于阻塞线程状态势必会影响计时的准确性,所以浏览器中的定时器并不是由 JavaScript引擎
来计数的。JavaScript引擎
的处理队列中,等待 JavaScript引擎
空闲后再执行。W3C
在 HTML标准
中规定,规定要求 setTimeout
中低于 4ms
的时间间隔算为 4ms
。JS脚本
的执行不会影响到 html元素
事件的触发,由于 JS单线程
关系,会将触发后需要执行的 JS脚本
添加到 JavaScript引擎
的处理队列中,当 JavaScript引擎
空闲时才会去执行。XMLHttpRequest
在连接后会通过浏览器新开一个线程请求。JavaScript引擎
的处理队列中,再由JavaScript引擎执行。