前端之页面加速

来源:互联网 发布:去水印软件免费版 编辑:程序博客网 时间:2024/05/16 18:53

1 页面加速之浏览器渲染

浏览器渲染涉及到CSS规则树,DOM tree 和渲染树问题。这里我只简单介绍一下页面渲染的过程,以后会学习其他的内容。浏览器已经得到css文件后,当载入body时,便可以开始渲染页面了,当遇到图片时,发出请求,此时浏览器继续渲染页面,但当服务器返回图片文件后,由于图片占了一定面积,影响后面布局,因此浏览器将进行重新渲染,这叫reflow,所以我们可以设置图片的大小,对reflow进行优化

2 页面加速之减少请求数

  • Base64编码

Base64编码会将图片进行编码直接嵌入html中,以减少html请求。但是图片不会阻止浏览器渲染。当所有的样式表(css)加载,解压缩和解析完之后,浏览器会构造cssom,之后构造渲染树,所以当将图片以编码的方式放入html中时,会增加CSS的大小,会延迟页面渲染。

本周未完成任务

1 CSS规则数

2 页面加速的其他方面

下周计划

CSS规则数