前端性能優化有哪些方法

來源：懂視網責編：小采時間：2020-11-27 13:59:57

前端性能優化有哪些方法

前端性能優化有哪些方法:前端性能優化方法：1、減少http請求數；2、圖片優化；3、使用CDN；4、開啟GZIP；5、樣式表和JS文件的優化；6、使用無cookie域名；7、前端代碼結構的優化。前端性能優化方法：1. 減少http請求數常用的減少http請求數有以下幾種：1）合并圖片。當圖片較多時，

推薦度：

點擊下載本文 文檔為doc格式

導讀前端性能優化有哪些方法:前端性能優化方法：1、減少http請求數；2、圖片優化；3、使用CDN；4、開啟GZIP；5、樣式表和JS文件的優化；6、使用無cookie域名；7、前端代碼結構的優化。前端性能優化方法：1. 減少http請求數常用的減少http請求數有以下幾種：1）合并圖片。當圖片較多時，

前端性能優化方法：

1. 減少http請求數

常用的減少http請求數有以下幾種：

1）合并圖片。當圖片較多時，可以合并為一張大圖，從而減少http請求數。經常變化的圖片可能不太合適，變化相對穩定的就可以考慮。合并大圖除了能減少http 請求數外，還可以充分利用緩存來提升性能。

2）合并壓縮css樣式表和js腳本，他們的共同目的都是為了減少http連接數。

3）去掉不必要的請求。開發寫代碼或者系統升級之后殘留的無效請求連接。

4）充分利用緩存。這里說的緩存是客戶端側緩存或者說瀏覽器緩存。Expires頭信息是客戶端側緩存的重要依據，格式類似于Expires:sun ,20 Dec 2017 23:00:00 GMT。如果當前時間小于Expires指定的時間，瀏覽器就會從緩存中直接獲取相關的數據信息或html文件，如果當前時間大于Expires指定的時間，瀏覽器會向服務器發送請求來獲取相關數據信息。

以Apache為例，可在Apache的配置文件httpd.conf中設置Expires。

2. 圖片優化

優化方法：

1）盡可能的使用PNG格式的圖片，它相對來說體積較小。

2）對于不同格式的圖片，在上線之前最好進行一定的優化。

3）圖片的延遲加載，也叫做賴加載。

3. 使用CDN

CDN即內容分發網絡，可以使用戶就近取得所需內容，解決網絡擁擠的狀況，提高用戶訪問網站的響應速度。

4. 開啟GZIP

GZIP即數據壓縮，用于壓縮使用Internet傳輸的所有文本資源。開啟GZIP的方法很簡單，到對應的web服務配置文件中設置一下即可。以Apache為例，在配置文件httpd.conf中添加。

5. 樣式表和JS文件的優化

一般我們會把css樣式表文件放到文件的頭部。比如，放到<head>標簽中，這樣可以讓CSS樣式表盡早地完成下載。對應js腳本文件，一般我們把他放到頁面的尾部。