用戶輸入網(wǎng)址，瀏覽器向服務器發(fā)出請求悯姊，服務器返回html文件羡藐；
瀏覽器開始載入全部的html代碼，發(fā)現(xiàn)
<head>標簽內有一個<link>標簽引用外部CSS文件悯许，瀏覽器又發(fā)出CSS文件的請求传睹，服務器返回這個CSS文件；瀏覽器繼續(xù)載入html中
<body>部分的代碼岸晦，并且CSS文件已經(jīng)拿到手了欧啤，開始邊解析DOM變渲染；瀏覽器在代碼中發(fā)現(xiàn)一個
<img>標簽引用了一張圖片启上，向服務器發(fā)出請求邢隧。此時瀏覽器不會等到圖片下載完，而是繼續(xù)渲染后面的代碼冈在；瀏覽器繼續(xù)執(zhí)行時倒慧，發(fā)現(xiàn)剛剛請求的圖片文件返回了，由于圖片占用了一定面積包券，影響了后面段落的排布纫谅，因此瀏覽器需要回過頭來重新渲染這部分代碼；
瀏覽器發(fā)現(xiàn)了一個包含一行Javascript代碼的
<script>標簽溅固，趕快運行付秕；瀏覽器發(fā)現(xiàn)了兩個個包含外部引用的
<script>標簽，請求并運行侍郭，發(fā)送了第一個js請求之后不是阻塞询吴，而是會繼續(xù)發(fā)送第二個JS的外部鏈接請求掠河，結果出現(xiàn)了意外，第二個js的內容先返回了猛计，這時候瀏覽器不會執(zhí)行第二個js的代碼唠摹，而是會等第一個js的代碼返回執(zhí)行后才執(zhí)行第二個js的代碼；瀏覽器發(fā)現(xiàn)了一個
<script>外部標簽奉瘤，但是包含了async屬性勾拉，說明是一個異步請求的js，發(fā)送請求但是不必等返回執(zhí)行盗温；在Javascript中望艺，腳本執(zhí)行了這條語句，它命令瀏覽器隱藏掉代碼中的某個
<div>（style.display=”none”）肌访。杯具找默，突然就少了這么一個元素，瀏覽器不得不重新渲染這部分代碼吼驶；終于等到了
</html>的到來惩激，這次渲染終于完成了，觸發(fā)DOMContentLoaded事件（jQuery中的$(document).ready();方法）蟹演。等待所有的圖片資源风钻、異步加載的JS文件請求完成了，瀏覽器趕緊觸發(fā)了
onload事件酒请。
另外經(jīng)過測試（chrome）骡技，在onload事件以前，瀏覽器標題的loading圖標都會一直存在羞反。
為方便查看布朦，寫了一個小小的測試Demo，為模擬模擬請求的不同延時昼窗，頁面打開大概需要20s是趴，打開Condole查看。
http://www.eamonning.com/demo/htmlRender/
