看了一篇文章：用CSS/JS優(yōu)化HTML頁面加載速度后，我覺得可以將我所知道的一些優(yōu)化技巧與原則告訴大家，一起分享。
這樣，也許你也能夠創(chuàng)造出屬于你自己的一些優(yōu)化心得與技巧。
本文是針對網(wǎng)頁設(shè)計的，不涉及程序以及系統(tǒng)。
一、基于減少HTTP連接數(shù)的優(yōu)化
像剛才這篇文章，就是基于減少并發(fā)HTTP連接數(shù)的優(yōu)化。由于IE每次在一個域上并發(fā)連接數(shù)默認為8個，這意味著超過8個文件的時候，需要等待前8個文件之一傳輸結(jié)束。
我們可以：
1、將圖片，尤其是大圖片放到另外一個域名中。大站可以用另一個服務(wù)器來專門用于圖片的傳輸。對于虛擬主機可以綁定另外一個域名。
這在大網(wǎng)站中很常見。
2、合并CSS和JS文件。以及在可能的時候合并圖片。
3、預(yù)加載技術(shù)。最近很常見的，就是先用js顯示縮略圖，然后setTimeout延時加載大圖片。
二、基于減少體積的優(yōu)化
減少體積意味著減少帶寬，能夠很直接地減少硬件與帶寬的開支。由于網(wǎng)站每日接待成千上萬的訪客，就是一個字節(jié)的優(yōu)化也可以帶來顯著的效果。
1、減小CSS、JS和HTML的體積。
用簡寫的方法來寫CSS。推薦用dreamweaver cs4來寫CSS，因為代碼提示默認就是簡寫的。#ffffff可以簡寫成#fff，margin:上 右 下 左，等等…
刪除注釋。除了保留版權(quán)聲明，其他注釋可以刪除。刪除不必要的空格和換行，就像google做的一樣。用JS壓縮工具來壓縮JS。體積上的變化很明顯。有的JS壓縮工具會導(dǎo)致JS發(fā)生錯誤。推薦用JQuery也使用的壓縮工具。很穩(wěn)定，效果也很好。
推薦DIV+CSS布局，這是老生常談。然而對于開發(fā)速度上效率的降低，可以用研究柵格系統(tǒng)、研究重用方案來解決。
不要濫用div、H1～H6等標(biāo)簽。除了速度，更是SEO上的考慮。
一手良好的div+css不是一夕一朝就能練成的。
2、減小圖片的體積
在PS里“儲存于WEB和設(shè)備所用格式”可以減少不少體積。對于圖片質(zhì)量要求不高的圖片，可以儲存為gif格式。此外在gif格式下，只要增加一點點損耗就可以帶來明顯的體積變化。如果用“儲存”菜單來保存用于WEB的圖片，最好選擇索引模式，可以至少減少三分之一的體積。
三、基于運算速度的優(yōu)化
運算速度更多的是WEB后端的事情，但是并不意味著脫得了前端的干系。
JS運算速度的優(yōu)化。典型就是循環(huán)操作DOM，不要直接操作DOM，而是先createElement到一個變量，在這個變量中增加DOM，然后再附加到文檔樹上。此外，不要以為內(nèi)存泄漏只是C++們的事情。JS也會導(dǎo)致內(nèi)存泄漏。這個話題比較復(fù)雜，推薦大伙兒們閱讀'ajax in action'。制作一個成熟的ajax應(yīng)用需要注意的事項全部都有，與后臺語言無關(guān)。閱讀算法的書。可能讓一個前端開發(fā)師閱讀算法的書有些搞笑，但是，有些極端場合還是會出現(xiàn)因為JS執(zhí)行耗時過多，瀏覽器要終止JS的運行。
四、其他優(yōu)化。
可以是基于瀏覽器的特性、基于用戶的體驗進行優(yōu)化。大家可以天馬行空地發(fā)揮！
IE在加載CSS之前會出現(xiàn)瞬時的無CSS狀態(tài)的頁面?？梢酝ㄟ^加入一個空的<script type="text/javascript"></script>來解決。
不要在文檔里加入空的js，IE的BUG會導(dǎo)致這樣比較慢。
標(biāo)明圖像的高度和寬度，有利于網(wǎng)頁在加載過程中結(jié)構(gòu)保持一致。
當(dāng)一個鏈接是一個目錄的時候，比如svnhost.cn/article，要這樣：svnhost.cn/article/，因為沒有/，服務(wù)器會回應(yīng)一個301到有/的地址。
實在沒有辦法優(yōu)化了？那么還可以基于用戶體驗進行優(yōu)化，或者咨詢  雖然實質(zhì)上是增加服務(wù)器壓力、減慢反應(yīng)的。但是，用戶心理的優(yōu)化，才是真正的優(yōu)化！加個loading會讓用戶感覺等待的時間減少，比優(yōu)化幾個KB實在多了。