看到標題, 你一定會說都已經 5G 時代了, 還要在網絡提速上下功夫么?

答案是: 是的.

如果你是做國際或者全球業務的, 會更有體會, 很多國家和地區的網絡是非常差的, 說他們停留在 2G 時代也不過分的.

即使是國內良好的網絡環境下, 做好網絡提速, 也是可以提高用戶體驗以及緩解服務壓力的.

CDN

首先, 網絡提速最快的方式是使用 CDN 加速, CDN的全稱是Content Delivery Network, 即內容分發網絡.

CDN 的主要優點是:

緩存資源, 減少JS,CSS等靜態資源網絡傳輸鏈路長度, 提高響應速度;

服務快速定位, CDN 會盡可能避開互聯網上有可能影響數據傳輸速度和穩定性的瓶頸和環節, 使內容傳輸的更快更穩定;

客戶端緩存

合理利用客戶端緩存也是網站提速中很重要一個環節.

客戶端緩存主要是靠 HTTP 響應頭中的參數實現的, 下面一起看下這些參數.

Last-Modified

Last-Modified表示文檔最后修改時間.

在瀏覽器第一次請求某一資源時, 會用Last-Modified屬性記錄該文件在服務器端最后被修改的時間. 如:

Last-Modified : Fri , 27 Nov2020 20:20:20 GMT

瀏覽器再次請求時, 會向服務器傳送If-Modified-Since報頭, 詢問該時間之后文件是否有被修改過, 如:

If-Modified-Since : Fri , 27 Nov2020 20:20:20 GMT

如果資源沒有變化, 則返回304狀態碼, 也不需要再次返回文件內容.

Expires

Expires 是HTTP1.0 規范定義的, 表示文件過期時間;

在瀏覽器內可以通過這個時間來判斷是否發送請求.

ETag

ETag 在http1.1規范定義的, 是Entity Tag 的縮寫, 是指實體標簽.

Etag一般會使用哈希計算, 同時也會消耗CPU性能, 所以很少使用.

Cache-Control

Cache-Control 是HTTP1.1的規范, 定義文件緩存使用情況.

一般會使用 max-age定義文件在瀏覽器中緩存時間;

CDN廠商一般會要求cache-control的值為public, 提升緩存命中率.如果定義了max-age, 可以不用再定義public, 它們的意義是一樣的;

請求頭:

請求頭值	功能
no-store	應禁用緩存
max-age	文件可以在瀏覽器中緩存的時間以秒為單位
s-maxage	用戶代理層緩存, CDN下發, 當客戶端數據過期時會重新校驗
max-stale	緩存最大使用時間, 如果緩存過期, 但還在這個時間范圍內則可以使用緩存數據
min-fresh	緩存最小使用時間,
must-revalidate	當緩存過期后, 必須回源重新請求資源。
proxy-revalidate	和must-revalidate類似, 只對CDN這種代理服務器有效, 客戶端遇到此頭, 需要回源驗證
stale-while-revalidate	表示在指定時間內可以先使用本地緩存, 后臺進行異步校驗
stale-if-error	在指定時間內, 重新驗證時返回狀態碼為5XX的時候, 可以用本地緩存
only-if-cached	那么只使用緩存內容, 如果沒有緩存 則504 gateway timeout

響應頭:

響應頭值	功能
public	響應的數據可以被緩存, 客戶端和代理層都可以緩存
private	可私有緩存, 客戶端可以緩存, 代理層不能緩存（CDN, proxy_pass）
no-cache	可以使用本地緩存, 但是必須發送請求到服務器回源驗證
no-store	應禁用緩存
max-age	文件可以在瀏覽器中緩存的時間以秒為單位
s-maxage	用戶代理層緩存, CDN下發, 當客戶端數據過期時會重新校驗
max-stale	緩存最大使用時間, 如果緩存過期, 但還在這個時間范圍內則可以使用緩存數據
min-fresh	緩存最小使用時間,
must-revalidate	當緩存過期后, 必須回源重新請求資源。
proxy-revalidate	和must-revalidate類似, 只對CDN這種代理服務器有效, 客戶端遇到此頭, 需要回源驗證

Nginx 配置

上述Expires, Cache-Control 等配置都可以在 nginx中配置實現.

其中Last-Modified需要ngx_http_ssi_module模塊支持.

server {listen 80;root /opt/html;index index.php index.html index.htm;location ~* ^.+.(css|js|txt|xml|swf|wav)$ {add_header Last-Modified $date_gmt;add_header Cache-Control no-store;add_header Cache-Control max-age=3600;add_header Cache-Control public;add_header Cache-Control only-if-cached;add_header Cache-Control no-cache;add_header Cache-Control must-revalidate;}location ~* ^.+.(ico|gif|jpg|jpeg|png)$ { expires 30d;} }

瀏覽器緩存原則

首頁可以看作是框架, 應該禁用緩存, 以保證加載的資源都是最新的;

只緩存200響應頭的數據, 像3XX這類跳轉的頁面不需要緩存;

對于js, css這類可以緩存很久的數據, 可以通過加版本號的方式更新內容;

不需要強一致性的數據, 可以緩存幾秒;

在服務器添加Server頭, 有利于排查錯誤;

APP應用緩存

APP 應用緩存與瀏覽器緩存稍有不同, 主要焦點更傾向于在沒有聯網的狀態下可以展示數據, 提高用戶體驗.

減少流量消耗

漂亮的加載過程

提前下發, 避免秒殺時同時下發數據造成流量短時間暴增;

兜底數據, 在服務器崩潰和網絡不可用的時候展示;

臨時緩存, 退出即清理;

固定緩存, 展示框架這種, 可能很長時間不會更新, 可用隨客戶端下發;

父子連接, 頁面跳轉時有一部分內容不需要重新加載, 可用從父菜單帶過來;

預加載, 某些邏輯可用判定用戶接下來的操作, 那么可用異步加載那些資源;

異步加載, 先展示框架, 然后異步加載內容, 避免主線程阻塞;

總結

以上是生活随笔為你收集整理的ccxprocess可以禁用么_提效 | 5G时代网站还需要加速么?的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。