dns-prefetch
看别的网站的时候经常看到类似这样的的代码<link rel="dns-prefetch" href="https://fonts.googleapis.com/"> ，那dns-prefetch到底有什么用呢？
dns-prefetch（DNS预获取）是尝试在请求资源之前解析域名，仅对跨域上的dns查找有效。 dns-prefetch 可帮助开发人员掩盖 DNS解析延迟
当浏览器从（第三方）服务器请求资源时，必须先将该跨域域名解析为 IP地址，然后浏览器才能发出请求。此过程称为 DNS解析。DNS 缓存可以帮助减少此延迟，而 DNS解析可以导致请求增加明显的延迟。对于打开了与许多第三方的连接的网站，此延迟可能会大大降低加载性能。dns-prefetch 可帮助开发人员掩盖 DNS解析延迟
script 标签的defer和async 属性
当浏览器加载 HTML 时遇到script标签，就会等待script脚本执行完成再去加载后边的dom元素，造成页面的阻塞, defer 和 async 属性解决了这个问题
下面说下三种不阻塞页面加载的方式
defer 和 async 还有动态创建script
接下来说下html页面的生命周期
DOMContentLoaded，load，beforeunload，unload
beforeunload
window.onbeforeunload = function (e) {
e = e || window.event;
// 兼容IE8和Firefox 4之前的版本
if (e) {
e.returnValue = '关闭提示';
}
// Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
return '关闭提示';
};
unload
假设我们收集有关页面使用情况的数据：鼠标点击，滚动，被查看的页面区域等。当用户要离开的时候，我们希望通过 unload 事件将数据保存到我们的服务器上
window.addEventListener('unload', logData, false);
function logData() {
navigator.sendBeacon("/log", analyticsData);
}
navigator.sendBeacon的使用
用于通过HTTP将少量数据异步传输到Web服务器。
为满足统计和诊断代码的需要，这些代码通常尝试在卸载（unload）文档之前向web服务器发送数据。过早的发送数据可能导致错过收集数据的机会。为了解决这个问题， 统计和诊断代码通常要在 unload 或者 beforeunload (en-US) 事件处理器中发起一个同步 XMLHttpRequest 来发送数据。同步的 XMLHttpRequest 迫使用户代理延迟卸载文档，并使得下一个导航出现的更晚。下一个页面对于这种较差的载入表现无能为力。
但是 sendBeacon() 方法会使用户代理在有机会时异步地向服务器发送数据，同时不会延迟页面的卸载或影响下一导航的载入性能。这就解决了提交分析数据时的所有的问题：数据可靠，传输异步并且不会影响下一页面的加载
- 请求以 POST 方式发送。
- 我们不仅能发送字符串，还能发送表单以及其他格式的数据
- 数据大小限制在 64kb。
#参考
