前端

parse html

2020-06-06  本文已影响0人  Time_Notes

解析HTML的过程

浏览器需要加载解析的不仅仅是HTML,还包括CSS、JS、以及加载图片、视频等其他媒体资源。

注意,浏览器的解析过程并非是串行的。比如在解析CSS的同时,可以继续加载解析HTML;但在解析执行JS脚本时,会停止解析后续HTML,这就会出现阻塞问题。


基本流程

HTML解析

浏览器解析是从上往下一行一行地解析的,解析的过程可以分为四个步骤:

1.解码(decoding)

传输回来的都是一些二进制字节数据,浏览器需要根据文件指定编码(如UTF-8)转换成字符串,也就是HTML代码。

2.预解析(pre-parsing)

预解析做的事情是提前加载资源,减少处理时间,它会识别一些请求资源的属性,如img标签的src属性,并将这个请求加到请求队列中。

3.符号化(Tokenization)

符号化是词法分析的过程,将输入解析成符号。HTML符号包括:开始标签、结束标签、属性名和属性值。

它通过一个状态机去识别符号的状态,如遇到<,>状态都会产生变化。

4.构建树(tree construction)

注意:符号化和构建树是并行操作的,就是说只要解析到一个开始标签,就会创建一个DOM节点。

在上一步符号化中,解析器获得这些标记,然后以合适的方法创建DOM对象并把这些符号插入到DOM对象中。

浏览器容错进制

你从来没有在浏览器看过类似"语法无效"的错误,这是因为浏览器纠正错误的语法,然后继续工作。

事件

当整个解析的过程完成以后,浏览器会通过DOMContentLoaded事件来通知DOM解析完成。

上一篇 下一篇

猜你喜欢

热点阅读