浏览器如何渲染

Posted 啦啦啦

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了浏览器如何渲染相关的知识,希望对你有一定的参考价值。

什么是浏览器渲染??
就是把从服务哪里得到的html,css,js等资源,经过一些列处理,渲染到web页面

步骤

  • 获取html,解析成DOM树
  • 处理css,解析为cssdom
  • 将dom树和cssdom合并成渲染树
  • 布局layout,计算每个元素的大小位置
  • 绘制pass,将渲染树的各个节点绘制到屏幕上

注意

  • 五个步骤不一定顺序完成
  • dom树的构建可能被css和js的加载阻塞

以上是关于浏览器如何渲染的主要内容,如果未能解决你的问题,请参考以下文章

浏览器如何渲染页面?

前端技能树,面试复习第 40 天—— 浏览器原理:浏览器渲染原理,如何优化渲染过程

了解浏览器如何工作—渲染引擎1

如何检测当前页面的浏览器渲染模式?

浏览器是如何渲染页面的?

如何在浏览器中监控渲染时间?