改善百度统计引入代码

我完全没理解百度为什么还不改进它的统计代码引入方式，在最糟糕的情况，我发现9秒之后页面才有响应。

百度原始的代码

document.write的方式：

改善后的代码

不要暴露全局变量，用相对 URL 代替协议检测，优先使用 document.head 属性。

动态的script dom方式：

模拟服务器脚本

ruby sinatra，模拟网络响应延迟2秒，脚本执行消耗延迟2秒：

有什么选择

由于是跨域加载统计代码，有大概三种不同方式：

• document.write 会阻塞页面资源，当前百度所使用的，Google Analytics老版也用过的。
• script dom 广告植入、页面统计等的最佳选择，当前Google Analytics 采用的，改进后将借鉴的版本。
• script defer 所有浏览器已支持，测试中糟糕的情况直到 window onload 事件后才执行，太迟了，需放弃。

支持 async 的浏览器：
document.createElement('script') 时，async 的值默认是 true 。async 是最理想的，它能保证脚本不阻塞页面加载，但不能保证脚本执行顺序。

支持 defer 的浏览器：
document.createElement('script') 时，defer 的值默认是 false 。defer 也不阻塞页面加载，这只是指页面的其他的资源。它能保证脚本执行顺序，推迟了自己的执行时间，但有可能会阻塞其他脚本的执行。因此，它可能在 DOM 解析好就执行，先于 DOMContentLoaded，也可能被浏览器缓存起来，在 DOMContentLoaded 之后执行。特别情况有两点，IE 是它可以在 window onload 之后才执行；Firefox 会始终让 DOMContentLoaded 优先触发，让其他脚本执行。

输出顺序参考

* DOMContentLoaded 事件，此时文档可操纵，界面事件将绑定上，界面可操控
* window onload 事件，此时脚本、样式表、图片资源全部加载完成

document.write:
  h.js loaded.  
  DOMContentLoaded
  window loaded

script dom: 
  DOMContentLoaded
  h.js loaded
  window loaded

script defer:
  DOMContentLoaded
  window loaded
  h.js loaded.

参考

http://mathiasbynens.be/notes/async-analytics-snippet

转载于:https://www.cnblogs.com/ambar/archive/2011/12/21/improve-baidu-analytics-script.html