如何進行網站性能優化

 

1.合併js和css文件

將js和css分別合併到一個共享文件，這樣不只可以簡化代碼，並且在執行js文件是，若是js文件較多，就須要屢次向服務器請求數據，這樣將會延長加載速度，將js文件合併在一塊兒，減小了請求的次數，就可以提升加載的速度；

2.Sprites圖片技術（圖片精靈技術）

圖片精靈技術是一種經常使用的頁面速度加載優化的方式，它是將一個頁面涉及到的全部的零星圖片（注意：只是那些曉得圖片、icon）都包含到一張大圖中，而後利用css的背景屬性將其相應的圖片在如今響應的文字，這樣當訪問一面時，只用加載一張大圖便可，而不用一幅一幅的去請求。這種方法既減小了圖片的大小，有減小了http請求的次數，能夠很大程度的優化頁面的加載熟讀

3.壓縮圖片和文本

壓縮圖片和文本也能夠減少數據的大小，尤爲是代碼的壓縮，如HTML、XML、JSON、javascript、css等代碼的壓縮率可達70%以上，代碼壓縮後能夠大大減小文件的體積，是頁面能夠快速的加載

4.按需加載（及可見區域之外的區域延時加載）

爲了讓用戶能夠更快的看到網頁中交重要的內容，能夠優先加載可見區域的內容，延時加載不可見區域的內容，爲了不頁面變形可使用佔位符，佔位圖片來固定寬高。如jquery中的ImageLazyLoad等一些插件就能夠很好的實現按需加載，只有當用戶鼠標向下滾動式，下面得圖片纔會加載。固然也能夠用原生的js來實現。

5.確保功能圖片優先加載

網站主要考慮可用性的重要性，一個功能按鈕要提早加載出來，用戶進入下載頁，一個只須要8s時間的下載，花了5s在等待、尋找下載按鈕圖片，誰能忍受?

6.圖片格式優化

不正確的使用圖片格式是一種很常見的拖慢加載速度的緣由，正確的使用圖片格式能夠數倍的減少圖片的大小。通常網頁的大圖，如banner圖片通常使用jpg格式，由於jpg是一種有損壓縮，能夠最大程度的減少圖片的體積，並且不會影響視覺體驗（不支持透明通道）；小圖片通常用png格式，通常是無損壓縮的（保留透明通道）。

7. 使用 Progressive JPEGs（高級JPEG）

ProgressiveJPEGs圖片是JPEG格式的一個特殊變種，名爲「高級JPEG」。在建立高級JPEG文件時，數據是這樣安排的：在裝入圖像時，開始只顯示一個模糊的圖像，隨着數據的裝入，圖像逐步變得清晰。它至關於交織的GIF格式的圖片。高級JPEG主要是考慮到使用調制解調器的慢速網絡而設計的，快速網絡的使用者一般不會體會到它和正常JPEG格式圖片的區別。對於網速比較慢的用戶，這無疑有很好的體驗。

8.代碼的精簡

代碼的是最直接的方法，也是對於一個程序員編程能力的考驗。對代碼進行優化，以最少的代碼來實現所需的功能，及減小了文件的體積，同時也減小了沒必要要的時間的浪費。同時沒必要要的空格、註釋、換行等的減小，也能夠減小文件的體積。

9.延遲加載和執行非必要代碼

網頁中的大部分js代碼都是在頁面加載後才須要執行的，因此對於這些代碼能夠寫在window.onload事件的回掉函數中。這樣可使頁面主體和一些必要的js代碼優先加載的出來，而後來去請求非一開始就須要的代碼。

10.使用Ajax

當一個頁面只有一部分須要更新時，可使用ajax來對頁面進行異步的更新，這樣不須要從新的刷新整個頁面，從新請求整個1頁面的數據，而只須要請求須要的那部分數據更新頁面便可。這樣既提升了頁面的加載速度，有提升了體驗性。

11.藉助自動化工具來實現頁面的優化

好比RadwareFastView