1.DNS预解析
通过 DNS 预解析来告诉浏览器未来我们可能从某个特定的 URL 获取资源，图片或音频资源等
<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href=" http://www.example.com 填入预解析的网址">
2.预加载静态资源prefetch
<link rel="prefetch prerender" href="http://www.example.com/style.css"><!--加载静态的资源-->
3.预连接 Preconnect
使用 preconnect 告诉浏览器我们需要进行哪些网站的预连接，减少DNS开销，预先建立socket连接
<link rel="preconnect" href="http://example.com">
4.预获取 Prefetching
如果我们确定某个资源将来一定会被使用到，我们可以让浏览器预先请求该资源并放入浏览器缓存中。例如，一个图片和脚本或任何可以被浏览器缓存的资源：
<link rel="prefetch" href="image.png"> 低优先级的资源预加载
Subresources
这是另一个预获取方式，这种方式指定的预获取资源具有最高的优先级，在所有 prefetch 项之前进行：例如字体文件
<link rel="subresource" href="styles.css">
如果资源是当前页面必须的，或者资源需要尽快可用，那么最好使用 subresource 而不是 prefetch
5.预渲染 Prerender
这是一个核武器，因为 prerender 可以预先加载文档的所有资源：
<link rel="prerender" href="http://example.com">
关于性能优化
1、http://www.w3cdream.com/content-sort-21-article-578.html
2、http://ddtalk.github.io/blog/2015/09/07/dingding-first/
3、https://csspod.com/frontend-performance-best-practices/
4、http://dev.cmcm.com/archives/312
