WEB開發編碼原則：優化Javascript文件,並將其放到頁面底部

在這篇博文中指出：

 一、整個頁面文檔家在結束纔開始加載css和js以及其餘的數據

 二、當頂部的全部js都家在結束以後才能夠加載頁面中的圖片

 三、頂部的common.css和common.js幾乎是同時開始加載

 四、底部的loader-min.js和離他最近的footer.jpg也是同時開始加載

 

從這裏面能夠得出的結論是

一、儘可能減小整個document的大小和頂部css的大小，加快他們的加載，甚至在整個頁面比較小的狀況下能夠將css放在底部。

二、javascript放在底部，這樣就能夠和圖片幾乎同時下載，讓圖片儘快的下載下來

---

回覆感受也頗有道理：

22 樓 fighter_Jon 2010-11-01  

優化應該是個權衡的過程 
js放在底部是防止js對以後資源形成阻塞 
可是若是是web app應用部分js也須要放在head部分 保證頁面功能完整 而不是頁面先行 

13 樓 smildlzj 2010-10-30  

PS... 
LZ知識沒學好.. 
每個讀取js,css,圖片什麼都是一個http鏈接,關長鏈接啥事... 

CSS儘可能放頭部, 
js儘可能放最後(不過通常仍是會放頭部) 
css,圖片會並行下載

10 樓 Saito 2010-10-29  

嗯.hoooooooooopo說的沒錯. 

http1.1規範裏面建議每一個domain兩個鏈接並行下載.因此能夠把圖片什麼的分域名. 

腳本會阻塞的緣由是: 瀏覽器不知道腳本會不會修改DOM. 好比腳本里面可能會call document.write. 

 

根據yahoo YUI團隊總結的網站前端優化14條原則，是將腳本放在底部，將樣式表放在頂部。 

緣由： 
瀏覽器在下載js的時候不能並行下載，會阻塞其餘資源的下載，這樣致使總體響應時間變長

2 樓 zhxing 2010-10-28  

據我所知，這個是因爲解析hmtl的解析器有關。。把js （不關鍵服務）放在底部--由於解析html 是順序解析的，能夠放到最後解析把css 放在最頭部--由於css早點加載有利於頁面的展現，css後加載，頁面排版不全都亂了。