页面渲染机制(一、DOM和CSSOM树的构建)
2024-09-02 00:18:43
1、HTML的加载
HTML是一个网页的基础,下载完成后解析
2、其他静态资源加载
解析HTML时,发现其中有其他外部资源链接比如CSS、JS、图片等,会立即启用别的线程下载。
但当外部资源是JS时,HTML的解析会停下来,等JS下载完执行结束后才继续解析HTML,防止JS修改已经完成的解析结果
3、DOM树构建
在HTML解析的同时,解析器会把解析完成的结果转换成DOM对象,再进一步构建DOM树
4、CSSOM树构建
CSS下载完之后对CSS进行解析,解析成CSS对象,然后把CSS对象组装起来,构建CSSOM树
5、渲染树构建
当DOM树和CSSOM树都构建完之后,浏览器根据这两个树构建一棵渲染树
6、布局计算
渲染树构建完成以后,浏览器计算所有元素大小和绝对位置
7、渲染
布局计算完成后,浏览器在页面渲染元素。经过渲染引擎处理后,整个页面就显示出来
最新文章
- Y+的一些讨论
- 随机生成UUID(GUID)的方法
- sql server 分页存储过程
- BZOJ 1054 题解
- ReadOnly关键字修饰的变量可以修改,只是不能重新分配
- Vijos p1518 河流 转二叉树左儿子又兄弟
- shell 判断字符串是否为数字
- 大数据计算:如何仅用1.5KB内存为十亿对象计数
- Python 执行字符串表达式函数(eval exec execfile)
- HBase MVCC 代码阅读(一)
- Rar related CMD
- Python求解进制问题(阿里巴巴2015笔试题)
- Mysql的硬件优化和配置优化
- linux下的重命名
- 更新Newtonsoft.Json后报异常,未能加载文件或程序集“Newtonsoft.Json
- listview的两种适配器
- mean函数一个神代码
- 我的 Delphi 学习之路 —— Delphi 助手的安装
- Python并发编程-事件,红绿灯控制
- PlayMaker的特殊事件FINISHED
热门文章
- 【HANA系列】SAP ECLIPSE中创建ABAP项目失败原因解析
- JSON中文处理类实例
- 在windows上远程访问服务器jupyter notebook
- angular [NgClass] [NgStyle],NgIf,[ngSwitch][ngSwitchCase]
- jenkins pipline和jenkinsfile
- LayaAir疑难杂症之四:laya引擎自动断点到bundle.js文件中且无报错,但程序不再执行
- Git 的这个神技,学会爽歪歪~
- Python 把较长的一行代码分成多行的技巧
- php之CGI、FastCGI、php-fpm运行原理
- 用C#控制台编写 推箱子之类的 坐标移动----之二维坐标