前言
當我了解完html在瀏覽器中的解析渲染流程后，反而又發現了新的困擾自己的問題。
Q:即然html要渲染需要渲染樹，而渲染樹又需要DOMTree和CSSRuleTree，DOMTree需要解析HTML，但是當解析到JS時需要js下載執行完才能繼續執行解析。這樣的話，那js放在哪里阻塞解析也只是早晚的問題。那放在前面后面都一樣？！但是這又跟開發遇到的情況不一樣。
猜想
前面的問題矛盾就在需要完成的DOM樹，但是DOM樹的構建又會被JS打斷。所以我猜想：瀏覽器的渲染不需要完整的DOM樹！
也就是說瀏覽器不需要等到HTML解析完就開始配合CSSRuleTree開始渲染了。這也就能合理的解析js要放在body的最底部。
試驗
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>welcome to Ahole's test Demo</div>
<script src="http://www.ahole.cn/play-in-mobile/js/zepto.js"></script>
<div>我是白老鼠！</div>
</body>
</html>
timeline過程寫的很清楚
可以看出瀏覽器解析遇到js的時候就會停止，但是並不會傻傻等待js的執行，瀏覽器把構建一半的的DOMTree跟CSSRuleTree 生成渲染樹，並渲染．
等下載執行完ｊｓ再去解析html 再渲染．
結論
可以看出瀏覽器發生了兩次渲染，而且這兩次渲染中間是js的解析和執行。這說明在解析js之前，html就已經被渲染了。這也就證實了我的猜想。所以啊，為了優化首屏時間，最好還是把js放在body底部吧！