前言:
在web性能優化的領域, 經常能聽到一個詞, 就是靜態/動態資源分離. 那靜態/動態資源分離究竟是什么呢?
本文不講文件系統服務, 雲存儲, 也不講基於CDN的優化. 就簡單講講基於nginx+tomcat的實現原理和部署方式.
體驗:
我們先來看個例子, 比如訪問百度首頁. 其訪問速度在各個資源的時間消耗比.
html文件的獲取很快, 時間消耗也少, 大部分時間都消耗在圖片和javscript代碼文件的下載中. 因此我們對網站訪問速度的衡量評估, 有個較理性的定量標准.
基本原理:
動態web服務器, 本身就是為了支持動態生成頁面而設計, 其對靜態資源的處理性能有所犧牲. 因此再承擔了較重的動態數據處理工作之后, 仍處理靜態資源, 其整體的服務能力, 是有一定的折扣的.
鑒於這種情況, 有人就引入了靜態web服務器, 來承擔靜態資源的訪問. 這樣就大大提高了web服務器整體的服務能力.
總而言之, 靜態/動態資源分離, 說白了就是靜態web服務器(apache, nginx)承擔靜態資源的訪問, 動態web服務器(tomcat, jboss, jetty)承擔動態資源的訪問.
nginx靜態資源配置:
上面說了那么多, 其實真實的實戰也就多了幾句簡單的配置而已. 不過這個性能優化的意識是需要有得.
nginx中, location指令的匹配優先級, 是遵循正則匹配優於普通字符串匹配的原則, 切勿過分關注配置項的前后順序.
靜態資源的nginx本地化, 只需要配置靜態資源的正則匹配規則, 同時指定其目錄位置即可.
比如如下規則:
server {
listen 80;
server_name domain.com www.domain.com;
root /path/to/webapp/resource; # 全局配置
location / {
proxy_pass http://127.0.0.1:8081;
}
location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|js|css)$ {
expires 30d;
root /path/to/webapp/resource; # 局部配置
}
location ~ .*\.(html)$ {
root /path/to/webapp/resource;
}
}
注: 可以全局配置, 在server一級子元素中配置root, 默認的靜態資源目錄. 也可以為每個location中, 配置其特定的root元素, 指定資源目錄. 同時expires可以設定靜態資源的緩存時間, 提高了訪問性能.
實戰測試:
編寫網頁test.html
<html>
<head> </head>
<body>
<img src="/images/longmao.jpg"/ >
</body>
</html>
引用的圖片資源為/images/longmao.jpg
對應的目錄結果如下所示:
在nginx.conf中配置root項為資源目錄即可.
nginx常用的命令:
nginx -t 檢測配置是否正確 nginx -s reload 熱載新的配置 nginx -s stop|quit|reopen|reload
在網頁上訪問, 既得到, 之前預想的效果.
測試成功, 棒棒噠, ^_^!!!
如果遇到403錯誤, 有可能是權限問題, 盡量回避使用root賬號來啟動nginx服務.
總結:
nginx感覺非常的強大, 而且配置也很簡單, 思路清晰明了. 權當筆記.
公眾號&游戲站點:
個人微信公眾號: 木目的H5游戲世界
個人游戲作品集站點, 請點擊訪問: http://120.26.221.54/.