其实我只是想写写前端性能测试的东西,不知不觉写了很多与之盘根错节的知识点。我这里只写些皮毛,我也只懂些皮毛。
#小白入门一
举个例子:
你要吃个菜,你找到厨师说,我要尖椒肉丝。
厨师就去翻菜谱,炒给你吃。
你是浏览者
菜是你将看到的页面
厨师是浏览器
菜谱是程序员写的页面代码
炒菜的过程,就是页面渲染
#小白入门二
渲染大致分为两部分,一部分是排版,一部分是绘制。排版就是根据文档流,加上浮动、定位等属性,确定各个盒子的位置还有尺寸。绘制就是将css的属性例如字体、背景色、圆角等等按照给定的方式呈现出来。各个浏览器的渲染效率不一样。
#小白入门三
浏览器这边做的工作大致分为以下几步:加载:根据请求的URL进行域名解析,向服务器发起请求,接收文件(HTML、JS、CSS、图象等)。解析:对加载到的资源(HTML、JS、CSS等)进行语法解析,建议相应的内部数据结构(比如HTML的DOM树,JS的(对象)属性表,CSS的样式规则等等)渲染:构建渲染树,对各个元素进行位置计算、样式计算等等,然后根据渲染树对页面进行渲染(可以理解为“画”元素)这几个过程不是完全孤立的,会有交叉,比如HTML加载后就会进行解析,然后拉取HTML中指定的CSS、JS等。