优化页面的三大原则

资源压缩合并，减少http请求

• 合并图片（css sprites）、CSS和JS文件合并、CSS和JS文件压缩
• 使用精灵图将都图片加载变为单个图片加载
• 图片懒加载

非核心代码异步加载

• 动态脚本加载 使用document.createElement创建一个script标签，即document.createElement('script')，然后把这个标签加载到body上面去。
• 通过异步的方式加载defer1.js文件 <script src="./defer1.js" defer></script>
• 通过异步的方式加载async1.js文件 <script src="./async1.js" async></script>

利用浏览器缓存

• 缓存 资源文件（比如图片）在本地存有副本，浏览器下次请求的时候，可能直接从本地磁盘里读取，而不会重新请求图片的url。