笔记：网页性能提升

图片

图片占网页传输的大部分有效载荷，图片优化可以带来大量的性能提升
webp格式
svg格式
图片懒加载

响应式图片

img的srcset属性，picture属性

字体

4种网络字体woff eot ttf woff2，woff支持度较广

CDN

1.浏览器会限定同一时间同一域名的请求数量，大约在6~10个左右，如谷歌限定为6个
2.当请求数量超过限定数量，便会阻塞请求，等待前面的完成再去执行
3.大型网站主页请求过多，使用CDN来减少同一域名同一时间的请求，减少用户等待时间

页面编写顺序

1.html渲染顺序，解释渲染树（html解释）→构建渲染树（css解释）→布局渲染树（reflow）→绘制渲染树（repaint）
2.css引入发生在构建渲染树期间，js的引入与执行开始发生在reflew期间，因此，在header中引入css，在body最后引入js