作者grence (逍遙盃)
看板Ajax
標題Re: [問題] 關於javascript擺放位置的疑問
時間Fri May 27 02:56:31 2011
yslow跟 page speed建議把 script標籤放在 dom tree最下面，
（白話一點的說法就是 </body>前面）
並且儘量把小檔案合併成一個大檔案，減少發出的 request數量，
最好可以再用程式 minify。
（minify: 在不影響執行結果的前提下，
移除不必要的空白、換行、註解；甚至改寫變數名稱之類的。）
大部分都滿有道理的，但是合併成一個大檔這點有些不同的聲音：
http://headjs.com/
latest browsers and Head JS can load scripts in parallel. loading 3 parts in
parallel instead of as a single chunk is usually faster.
．多個小檔案可透過平行下載進而提昇載入速度。
if an individual file is changed the whole combination changes and you lose
the benefits of caching. It’s better to combine only the stable files that
doesn’t change often.
．如果只有一個小檔案改變，那瀏覽器必需捨棄已有的快取下載合併之後的大檔案；
而不是保留大部分的快取只抓有變動的檔案。
many popular libraries are hosted on CDN. you should take the advantage of it
instead of hosting yourself.
iPhone 3.x cannot cache files larger than 15kb and in iPhone 4 the limit is
25kb. And this is the size before gzipping. if you care about iPhones you
should respect these limits.
．手機的快取有限
突然覺得我翻的不是很順，有空的話還是自己看原文吧。
然後依自己的狀況做取捨。
※ 引述《poopoo888888 (阿川)》之銘言：
: 如題
: 小弟最近被js code該放在哪給搞糊塗了
: 以前小弟都這樣放
: <head>
: <script>
: //blah blah.. 所有js code都放這
: </script>
: </head>
: 後來小弟發現 有時這樣擺也可以
: <body>
: <script>
: //blah blah..
: </script>
: </body>
: 後來又發現 有時不放在head跟body內也可以
: <html>
: <head>
: </head>
: <body>
: </body>
: <script>
: //blah blah ...
: </script>
: </html>
: 但對於放在各個地方到底有什麼差異 還是搞不太清楚
: 請問各個地方的差異何在 適用時機又為何呢？
: 謝謝各位大大！
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 180.176.84.58
1F：推 poopoo888888:獲益良多 謝謝您 05/27 08:20
2F：→ TonyQ:除了合併大檔以外，另一個路線是async download 不過技術 05/27 09:27
3F：→ TonyQ:要求比較高... 05/27 09:27
4F：推 tomin:有道理 Yahoo評分也沒錯 大網站要能兼容舊瀏覽器 05/27 19:49
5F：→ grence:二樓說的是瀏覽器技術支援嗎XD 05/27 20:40
6F：→ TonyQ:不只瀏覽器啊 開發者也是 XD 05/27 21:58