1、合并網頁(yè)中(zhōng)Js文(wén)件和CSS

将JS代碼和CSS樣式分(fēn)别合并到一個共享的文(wén)件，這樣不僅能(néng)簡化代碼，而且在執行JS文(wén)件的時候，如果JS文(wén)件比較多(duō)，就需要進行多(duō)次“Get”請求，延長(cháng)加載速度，将JS文(wén)件合并在一起後，自然就減少了Get請求次數，提高了加載速度。

2、使用(yòng)Sprites圖片技(jì )術

Spriting是一種網頁(yè)圖片應用(yòng)處理(lǐ)方式，它是将一個頁(yè)面涉及到的所有(yǒu)零星圖片都包含到一張大圖中(zhōng)去，然後利用(yòng)CSS技(jì )術展現出來。這樣一來，當訪問該頁(yè)面時，載入的圖片就不會像以前那樣一幅一幅地慢慢顯示出來了，可(kě)以減少了整個網頁(yè)的圖片大小(xiǎo)，并且利用(yòng)CSSSprites能(néng)很(hěn)好地減少網頁(yè)的http請求，從而大大的提高頁(yè)面的性能(néng)。

3、壓縮文(wén)本和圖片

壓縮技(jì )術如gzip可(kě)以有(yǒu)效減少頁(yè)面加載的時間。包括HTML，XML，JSON(JavaScript對象符号)，JavaScript和CSS等，壓縮率都可(kě)以在大小(xiǎo)70%左右。文(wén)本壓縮用(yòng)得比較多(duō)，一般直接在空間開啓就行，而圖片的壓縮就很(hěn)多(duō)的處理(lǐ)者比較随意，很(hěn)多(duō)都是直接上傳，其實這樣不好，一張未經壓縮的圖片和壓縮到80%品質(zhì)的圖片，在視覺上區(qū)别不大，但文(wén)件大小(xiǎo)卻相差4-5倍，所以為(wèi)了提高加載速度和降低存儲空間的占用(yòng)，圖片還是要處理(lǐ)的好。

4、延遲顯示可(kě)見區(qū)域外的内容

為(wèi)了确保用(yòng)戶可(kě)以更快地看見可(kě)見區(qū)域的網頁(yè)可(kě)以延遲加載或展現可(kě)見區(qū)域外的内容，為(wèi)了避免頁(yè)面變形，可(kě)以使用(yòng)占位符标簽制定正确的高度和寬度。比如WP的jQueryImage LazyLoad插件就可(kě)以在用(yòng)戶停留在第一屏的時候，不加載任何第一屏以下的圖片信息，隻有(yǒu)當用(yòng)戶把鼠标往下滾動的時候，這些圖片才開始加載。這樣很(hěn)明顯提升可(kě)見區(qū)域的加載速度，提高用(yòng)戶體(tǐ)驗。

5、确保功能(néng)圖片優先加載

網站主要考慮可(kě)用(yòng)性的重要性，一個功能(néng)按鈕要提前加載出來，用(yòng)戶進入下載頁(yè)，一個隻需要8s時間的下載花(huā)了5s在等待、尋找下載按鈕圖片，誰能(néng)忍受?

6、重新(xīn)布置Call-to-Action按鈕

其實這個和上面一條是差不多(duō)的，都是從用(yòng)戶體(tǐ)驗速度着手，跳過了網頁(yè)的整體(tǐ)加載速度。速度沒變，隻是讓一些行為(wèi)按鈕提前，Call-to-Action按鈕一般習慣設計在頁(yè)面底部，這樣的習慣對于用(yòng)戶來說并不總是好的，購(gòu)買用(yòng)戶需要等到最下面加載出來才能(néng)點擊下一步操作(zuò)。可(kě)以調整CTA按鈕的位置或使用(yòng)滑動的圖片按鈕。很(hěn)多(duō)大型購(gòu)物(wù)網站的加入購(gòu)物(wù)車(chē)就是這種類型。

7、圖片格式優化

不恰當的圖像格式是一種極為(wèi)常見的減慢加載速度的罪魁禍首。正确的圖片格式可(kě)以讓圖片縮小(xiǎo)數倍，如果保存為(wèi)最佳格式。可(kě)以節省大量帶寬，減少處理(lǐ)時間時間，大大加快頁(yè)面加載速度，這是一種很(hěn)常見的做法。一般色彩比較豐富的圖片采用(yòng)JPG格式（80%）的品質(zhì)，象圖标按鈕，如果是單色系，可(kě)以采用(yòng)GIF或PNG。如果有(yǒu)漸變的圖标和按鈕，則需要保存為(wèi)PNG，這時可(kě)以保存為(wèi)8位，而不需要保存24位。

8、使用(yòng) Progressive JPEGs

ProgressiveJPEGs圖片是JPEG格式的一個特殊變種，名(míng)為(wèi)“高級JPEG”。在創建高級JPEG文(wén)件時，數據是這樣安(ān)排的：在裝(zhuāng)入圖像時，開始隻顯示一個模糊的圖像，随着數據的裝(zhuāng)入，圖像逐步變得清晰。它相當于交織的GIF格式的圖片。高級JPEG主要是考慮到使用(yòng)調制解調器的慢速網絡而設計的，快速網絡的使用(yòng)者通常不會體(tǐ)會到它和正常JPEG格式圖片的區(qū)别。對于網速比較慢的用(yòng)戶，這無疑有(yǒu)很(hěn)好的體(tǐ)驗。

9、精(jīng)簡代碼

這個可(kě)以說是最直接的一個方法，也是用(yòng)得比較多(duō)的，對網頁(yè)代碼進行瘦身，删除不必要的沉冗代碼，比如不必要的空格、換行符、注釋等，包括JS代碼中(zhōng)的無用(yòng)代碼也需要清除。其中(zhōng)對于注釋代碼的清除可(kě)能(néng)有(yǒu)些人存在誤區(qū)，甚至有(yǒu)的在裏面堆砌關鍵詞。

10、延遲加載和執行非必要腳本

網頁(yè)中(zhōng)有(yǒu)很(hěn)多(duō)腳本是在頁(yè)面完全加載完前都不需要執行的，可(kě)以延遲加載和執行非必要腳本。這些腳本可(kě)以在onload事件之後執行，避免對網頁(yè)上重要内容的呈現造成影響。這些腳本可(kě)能(néng)是你自己網頁(yè)的甲苯，往往更多(duō)的是一些第三方腳本，這樣的有(yǒu)很(hěn)多(duō)，比如評論、廣告、智能(néng)推薦、百度雲圖、分(fēn)享等等，這些完全可(kě)以等主體(tǐ)内容加載完後再執行。

11、使用(yòng)AJAX

AJAX即“Asynchronous Javascript +XML“，是指一種創建交互式網頁(yè)應用(yòng)的網頁(yè)開發技(jì )術。通過在後台與服務(wù)器進行少量數據交換，AJAX可(kě)以使網頁(yè)實現異步更新(xīn)。這意味着可(kě)以在不重新(xīn)加載整個網頁(yè)的情況下，對網頁(yè)的某部分(fēn)進行更新(xīn)。傳統的網頁(yè)(不使用(yòng)AJAX)如果需要更新(xīn)内容，必須重載整個網頁(yè)面。