高併發只能通過提公升伺服器負載解決?
流量優化,前端優化,資料庫優化
快取只能做資料庫快取嗎?
資料庫快取, 檔案快取, 瀏覽器快取
http快取機制
http快取模型中, 如果請求成功會有三種情況;
200 from cache : 直接從本地快取中獲取響應, 最快速, 最省流量, 以為根本沒有向伺服器發起請求
304 not modified : 協商快取, 瀏覽器在本地沒有命中的情況下請求頭中傳送一定的校驗資料到服務端, 如果服務端資料沒有改變瀏覽器從本地快取響應, 返回304; 快速, 傳送的資料很少, 只返回一些基本的響應頭資訊, 資料量很小, 不傳送實際響應體;
200 ok : 以上兩種快取都失敗了, 伺服器返回完整響應, 沒有用到快取, 相對最慢
相關header:
pragma: http1.0時代的遺留產物, 該字段被設定為no-cache時, 會告知瀏覽器禁用本地快取, 即每次都向伺服器傳送請求;
expires: http1.0時代用來啟用本地快取的字段, expires值對應乙個刑辱thu,31 dec 2037 23:55:55 gmt的格林威治時間, 告訴瀏覽器快取實現的時刻, 如果還沒到該時刻, 標明快取有效, 無需請求; 瀏覽器與伺服器的時間無法保持一致, 如果時間差距大, 就會影響快取結果;
cache-control: http1.1針對expires時間不一致的解決方案, 運用cache-control告知瀏覽器快取過期的時間間隔而不是時刻, 即使具體時間不一致, 也不影響快取的管理;
no-store : 禁止瀏覽器快取響應
no-cache: 不允許直接使用本地快取, 先發起請求和伺服器協商
max-age=delta-seconds: 告知瀏覽器該響應本地快取有效的最長時限, 以秒為單位
優先順序: pragma > cache-control > expires
協商快取:
當瀏覽器沒有命中本地快取, 如果本地快取過期或者響應中宣告不允許直接使用本地快取, 那麼瀏覽器肯定發起服務端請求; 服務端會驗證檔案是否修改, 如果沒有修改會使用本地快取;
last-modified : 通知瀏覽器資源的最後修改時間, 當再次請求的時候服務端會判斷在這個時間節點之後檔案是否改動, 如果沒有修改會返回乙個304, 使用本地快取
last-modified: thu,31 dec 2037 23:55:55 gmt
if-modified-since: 得到資源的最後修改時間後, 會將這個資訊通過if-modified-since提交到伺服器檢測, 如果沒有修改返回304狀態碼
if-modified-since: thu,31 dec 2037 23:55:55 gmt
etage: http1.1推出, 檔案的指紋識別符號, 如果檔案內容改動, 指紋就會改變
適合快取的內容
不變的影象, 如logo, 圖示等
js, css靜態檔案
適合協商快取
html檔案
經常替換的
經常修改的js, css檔案
js, css檔案的載入可以加入檔案的簽名來拒絕快取
index.css?簽名
index.簽名.js
不建議快取的內容
使用者的隱私等敏感資料
經常改變的api資料介面
nginx配置快取策略
模擬nginx快取
本地快取配置:
add_header指令: 新增狀態碼為2xx和3xx的響應頭資訊
add_header name value[always];
可以設定pragma/expires/cache-control, 可以繼承
expires指令: 通知瀏覽器過期時長
expires time(d,s..時間單位)
下圖為資源快取30天
協商快取相關配置:
etag指令: 指定簽名(預設開啟的)
前端**和資源的壓縮
優勢: 讓資源檔案更小, 加快檔案的網路中的傳輸, 讓網頁更快的展現, 降低頻寬和流量開銷
壓縮方式: js, css, , html**的壓縮, 開啟nginx的gzip壓縮
js壓縮: 主要是去除空白符和回車, 替換長變數名, 簡化一些**寫法等
var a = 100;
var b = 200;
會轉換成 var a=100,b=200;
常用的工具: uglifyjs, yui compressor, closure compiler
css壓縮: 主要去除空白符和回車
html**壓縮: 不建議使用**壓縮, 有時會破壞**結構, 可以使用gzip壓縮
壓縮: 除了**的壓縮外, 有時對的壓縮也是有必要的, 一般情況下在web系統的比重都比較
壓縮工具: tinypng, jpegmini, imageoptim
gzip壓縮: 配置nginx配置
nginx配置:
gzip on|off; #是否開啟gzip
gzip_buffers 32 4k| 16 8k #緩衝(在記憶體中緩衝幾塊, 每塊多大)
gzip_comp_level [1-9] #推薦6壓縮級別(級別越高,壓縮的越小, 越浪費cpu計算資源)
gzip_disable #正則匹配ua什麼樣的uri不進行gzip
gzip_min_length 200 #開始壓縮的最小長度
gzip_http_version 1.0|1.1 #開始壓縮的http協議版本
gzip_proxied #設定請求者**伺服器, 該如何快取內容
gzip_vary on|off #是否傳輸gzip壓縮標誌
下圖可以看到響應裡有gzip
其他工具: 自動化構建工具grunt
瀏覽器快取的解決方案
瀏覽器快取的解決方案 摘要 瀏覽器快取的解決方案，包括傳統前端和現代前端。前言 本文只針對檔案請求 html css js 進行分析，但不涉及json資料請求。1 當瀏覽器向伺服器發起請求，如果請求正常，狀態是200。2 瀏覽器接收到請求結果後，如果會根據響應頭設定的快取規則，把請求結果存起來。3 ...
瀏覽器快取問題原理以及解決方案
減少網路頻寬消耗 降低伺服器壓力 減少網路延遲，加快頁面開啟速度 新鮮度 過期機制 也就是快取副本有效期。校驗值 驗證機制 資源的實體標籤etag entitytag 1 使用htmlmeta標籤web開發者可以在html頁面的節點中加入標籤，如下 事實上這種禁用快取的形式用處很有限 a.僅有ie才...
瀏覽器快取問題原理以及解決方案
減少網路頻寬消耗 降低伺服器壓力 減少網路延遲，加快頁面開啟速度 新鮮度 過期機制 也就是快取副本有效期。校驗值 驗證機制 資源的實體標籤etag entitytag 1 使用htmlmeta標籤web開發者可以在html頁面的節點中加入標籤，如下 事實上這種禁用快取的形式用處很有限 a.僅有ie才...