我们了解浏览器吗

102 阅读2分钟

前言:

我们为什么要了解浏览器?

要知道对于前端来说,不管我们写了多少代码,最直接的体现就是浏览器上呈现的页面,因为对于浏览器的了解,对我们来说真的很有用!!!书写的简单,便于和我一样白的小伙伴一起学习!

一、浏览器工作的线程

浏览器里面有很多线程,这里面的线程也各有用处。

  • 浏览器中有以下几个主要的线程:
  • 浏览器的主线程:主要用于页面的创建、销毁、或者一些网络资源,下载等等。
  • GCP线程:用于3D绘画(一个浏览器只有一个这样的线程)。
  • 第三方插件线程:在浏览器里可以安装不同的插件,而这些插件都会有各自的线程,只有在使用插件时才会创建。
  • 渲染线程:这是浏览器里最重要的线程,又叫浏览器内核,主要负责我们页面的渲染。

二、详细说明渲染进程

对于一个浏览器来说,渲染进程是至关重要的, 那渲染进程中包含那几个部分呢?

  1. GUI:主要用来解析HTML\CSS,和DOM树的渲染。
  2. js渲染引擎:主要用于解析Js脚本程序,又称为js内核(比较重要的我们一般都称之为内核,哈哈哈哈哈),由于js不仅是对ECMAScript的体现,还可以对Dom进行操作,对事件进行操作。所以说,这个地方GUI线程和JS渲染引擎线程是互斥的,当js正在操作DOM时,GUI会挂在一个任务队列里,当js执行完,立马执行自己。在浏览器中,js会一直准备工作,但是不管在任何时候,浏览器中都只有一个js线程在处理js代码。
  3. 事件渲染线程:如果满足事件触发条件,加在任务队列的队尾。
  4. 定时器:通过浏览器单独开一个线程计时,并触发定时器,加入任务队列。
  5. 异步请求:将检测到状态变更时,回调事件会放入js处理任务队列的列中,等待处理。
  6. 3、4、5点都是归属浏览器,(因为js是单线程的,所以有时候都是浏览器新开线程帮助它)

思考:

  1. 既然js和GUI是互斥的线程,如果js阻塞会出现什么样的情况? 答:白屏哦。因为js渲染阻塞,就不能开启GUI线程,渲染不了dom树。

欢迎小伙伴们有更多的思考和总结,我们一起讨论!!