webkit内核_web前端:关于浏览器内核的多线程机制

一、什么是浏览器内核

浏览器内核即浏览器底层最核心和最基础的那一部分,它主要负责对网页当中的htmlcssJavaScript进行解释然后在浏览器当中进行渲染最终呈现给用户,也就是说内核的工作就是渲染,所以我们常常把浏览器内核称为渲染引擎(Rendering Engine)也称为布局引擎(Layout Engine)、排版引擎
另外,由于不同浏览器的渲染内核不同,对 htmlcssJavaScript的语法解释也存在差异(兼容问题),因此我们在开发过程中需要在不同内核的浏览器当中进行网页渲染效果的测试。

二、五大浏览器四大内核

五大主流浏览器分别为:IE,火狐(Firefox),谷歌(Chrome),Safari,Opera
四大内核分别是:Trident、Webkit、Blink、Gecko

de824fc30a65b11a91a8129f64f34bf0.png

三、内核是浏览器的进程之一

我想说的是:**浏览器内核对页面的渲染,其实就是浏览器的渲染进程即Renderer进程。该进程拥有多个线程,这些线程共同来完成页面的渲染任务。**那么都有哪些线程呢,如下:

1、浏览器GUI(Graphical User Interface-----图形用户界面)渲染线程

  • 负责对浏览器界面进行渲染。
  • 当刷新或由于某些操作对界面局部渲染时,该线程会被执行。
  • 注意,GUI渲染线程JavaScript引擎线程是互斥的(不会同时执行的),即当JavaScript引擎线程执行时GUI线程会被冻结,GUI更新需要等到JavaScript引擎线程空闲时,才会执行。

2、JavaScript引擎线程

  • 负责解析、运行JavaScript脚本。
  • 一个标签页(渲染进程)中只会有一个JavaScript引擎线程运行JavaScript脚本。(JS是单线程的)
  • 同样注意,因为GUI渲染线程JavaScript引擎线程是互斥的,所以如果JS执行的时间过长,会造成页面的渲染不连贯,甚至渲染加载阻塞。

3、浏览器定时器触发线程(setTimeout、setInterval)

  • setTimeoutsetInterval所在的线程。
  • 由于JavaScript引擎是单线程的,如果处于阻塞线程状态势必会影响计时的准确性,所以浏览器中的定时器并不是由JavaScript引擎来计数的。
  • 该线程只是计时,一旦计时完毕后,会将触发的脚本添加到JavaScript引擎的处理队列中,等待JavaScript引擎空闲后再执行。
  • 注意,W3CHTML标准中规定,规定要求setTimeout中低于4ms的时间间隔算为4ms

4、浏览器事件触发线程

  • JS脚本的执行不会影响到html元素事件的触发,由于JS单线程关系,会将触发后需要执行的JS脚本添加到JavaScript引擎的处理队列中,当JavaScript引擎空闲时才会去执行。
  • 注意,该线程只是触发,触发后要执行的代码依然要放到JS引擎线程中去执行。

5、浏览器http异步请求线程

  • XMLHttpRequest在连接后会通过浏览器新开一个线程请求
  • 当状态发生变化时,如果之前有设置回调,会将这个回调再放入JavaScript引擎的处理队列中,再由JavaScript引擎执行。

d2fc94433cea3b4cfdd64db2e250d6b5.gif
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值