一、靜態(tài)頁面

靜態(tài)頁面，是指互聯(lián)網(wǎng)架構(gòu)中，幾乎不變的頁面(或者變化頻率很低)，例如：

• 首頁等html頁面
• js/css等樣式文件
• jpg/apk等資源文件

靜態(tài)頁面，有與之匹配的技術(shù)架構(gòu)來加速，例如：

• CDN
• nginx
• squid/varnish

二、動態(tài)頁面

動態(tài)頁面，是指互聯(lián)網(wǎng)架構(gòu)中，不同用戶不同場景訪問，都不一樣的頁面，例如：

• 百度搜索結(jié)果頁
• 淘寶商品列表頁
• 速運(yùn)個人訂單中心頁

這些頁面，不同用戶，不同場景訪問，大都會動態(tài)生成不同的頁面。

動態(tài)頁面，有與之匹配的技術(shù)架構(gòu)，例如：

• 分層架構(gòu)
• 服務(wù)化架構(gòu)
• 數(shù)據(jù)庫，緩存架構(gòu)

三、互聯(lián)網(wǎng)動靜分離架構(gòu)

動靜分離是指，靜態(tài)頁面與動態(tài)頁面分開不同系統(tǒng)訪問的架構(gòu)設(shè)計方法。

一般來說：

• 靜態(tài)頁面訪問路徑短，訪問速度快，幾毫秒
• 動態(tài)頁面訪問路徑長，訪問速度相對較慢(數(shù)據(jù)庫的訪問，網(wǎng)絡(luò)傳輸，業(yè)務(wù)邏輯計算)，幾十毫秒甚至幾百毫秒，對架構(gòu)擴(kuò)展性的要求更高
• 靜態(tài)頁面與動態(tài)頁面以不同域名區(qū)分

四、頁面靜態(tài)化

既然靜態(tài)頁面訪問快，動態(tài)頁面生成慢，有沒有可能，將原本需要動態(tài)生成的站點提前生成好，使用靜態(tài)頁面加速技術(shù)來訪問呢?

這就是互聯(lián)網(wǎng)架構(gòu)中的“頁面靜態(tài)化”優(yōu)化技術(shù)。

舉例，如下圖，58同城的帖子詳情頁，原本是需要動態(tài)生成的：

• 瀏覽器發(fā)起http請求，訪問/detail/12348888x.shtml 詳情頁
• web-server層從RESTful接口中，解析出帖子id是12348888
• service層通過DAO層拼裝SQL語句，訪問數(shù)據(jù)庫
• 最終獲取數(shù)據(jù)，拼裝html返回瀏覽器

而“頁面靜態(tài)化”是指，將帖子ID為12348888的帖子12348888x.shtml提前生成好，由靜態(tài)頁面相關(guān)加速技術(shù)來加速：

這樣的話，將極大提升訪問速度，減少訪問時間，提高用戶體驗。

五、頁面靜態(tài)化的適用場景

頁面靜態(tài)化優(yōu)化后速度會加快，那能不能所有的場景都使用這個優(yōu)化呢?哪些業(yè)務(wù)場景適合使用這個架構(gòu)優(yōu)化方案呢?

一切脫離業(yè)務(wù)的架構(gòu)設(shè)計都是耍流氓，頁面靜態(tài)化，適用于：總數(shù)據(jù)量不大，生成靜態(tài)頁面數(shù)量不多的業(yè)務(wù)。例如：

• 58速運(yùn)的城市頁只有幾百個，就可以用這個優(yōu)化，只需提前生成幾百個城市的“靜態(tài)化頁面”即可
• 一些二手車業(yè)務(wù)，只有幾萬量二手車庫存，也可以提前生成這幾萬量二手車的靜態(tài)頁面
• 像58同城這樣的信息模式業(yè)務(wù)，有幾十億的帖子量，就不太適合于靜態(tài)化(碎片文件多，反而訪問慢)

六、總結(jié)

“頁面靜態(tài)化”是一種將原本需要動態(tài)生成的站點提前生成靜態(tài)站點的優(yōu)化技術(shù)。

總數(shù)據(jù)量不大，生成靜態(tài)頁面數(shù)量不多的業(yè)務(wù)，非常適合于“頁面靜態(tài)化”優(yōu)化。

【本文為51CTO專欄作者“58沈劍”原創(chuàng)稿件，轉(zhuǎn)載請聯(lián)系原作者】

戳這里，看該作者更多好文