个人主页

# 页面渲染类

# 把css资源引用放到HTML文件头部

一般推荐将所有css资源今早指定在HTML的<head>中，这样浏览器可以优先下载css并尽早完成页面渲染。

# JavaScript资源引用放到HTML文件底部

JavaScript资源放到HTML底部可以防止JavaScript的加载和解析对页面的渲染造成阻塞。由于JavaScript资源默认是解析阻塞的，除非标记为异步

# 不要在HTML中直接缩放图片

在HTML中直接缩放图片会导致页面内容的重排重绘，此时可能会使页面中的其他操作产生卡顿，因此要尽量减少在页面中进行图片缩放。

# 减少DOM元素数量和深度

HTML中标签元素越多，标签的层级越深，浏览器解析DOM并绘制到浏览器中所花的时间越长，所以应尽可能保持DOM元素简洁和层级较少。

# 尽量避免使用<table>、<iframe>等慢元素

table内容的渲染是将table的DOM渲染树全部生成并一次性绘制到页面上，所以会比较消耗性能，可以考虑使用<ul>代替。尽量使用异步动态添加iframe，因为iframe内资源的下载进程会阻塞父页面静态资源的下载与css及dom解析。

# 避免运行耗时的JavaScript

长时间运行的javascript会阻塞浏览器构建DOM树、DOM渲染树、渲染页面。所以，任何与页面初次渲染无关的逻辑功能都应该延迟加载执行，这和JavaScript资源的异步加载思路是一样的。

# 避免使用CSS表达式或CSS滤镜

css表达式或css滤镜的解析渲染速度是比较慢的，在有其他解决方案尽量避免使用。