學問
最近“上層建築”在興起國學熱，所以公司幾個月前決定開發一款名叫“學問”的有關於國學的app。
APP的詳情頁面還是由web來顯現具體內容，有些類似於新聞頁，圖文混排什么的web是最適合干這個的了，所以團隊決定用WEB來實現詳情頁。
團隊對WEB頁的要求是：
- 頁面在訪問后離線依然可以查看。
- 首屏展現速度要快，不允許長時間白屏或loading。
項目現狀
后端提供的都是以JSON為數據格式的API接口供Native端使用，同樣提供給WEB的也是JSON格式的API接口
那么意味着WEB工作流程是
- 打開web，加載基本資源，如CSS，JS等
- 發起一個ajax請求再到服務端請求數據，同時展示loading
- 得到json格式的數據后再根據邏輯選擇模板渲染出”DOM字符串"
- 將”DOM字符串”插入頁面中webview渲染出DOM結構
這些步驟都由用戶所使用的設備中逐步執行，也就是說用戶的設備性能與APP的運行速度聯系的更緊
換句話說就是如果用戶的設備很低端，那么APP打開頁面的速度會越慢。
如果是在PC端的瀏覽器中基本不成問題，因為現在瀏覽器性能已經非常好了。但在低端的Android機器上的webview性能可就難說了。
而且離線后還得要查看已訪問過的頁面，實現最好的方式就是用HTML5的離線存儲技術了，但離線存儲存的是整個頁面的HTML及資源，不會存JSON數據
用本地數據庫存把JSON數據也存下來？靠，太復雜了吧...
只能是服務端直接輸出HTML結構渲染頁面，而不是API輸出JSON再由客戶端渲染頁面。
讓服務端人員來寫頁面？
確實可以依照以前老的方式，自己寫出HTML的靜態頁面交給服務端人員，再套上JSP或PHP服務端語言，但是..
由於服務端人員對前端HTML結構不熟悉套代碼時造成各種錯誤經常出現。而且很難找出BUG，相信做前端的程序猿應該都體會過..
也有很多前端人員不得不開始學習JSP或PHP來應付這樣的場景，全棧工程師么-_-!..
一種折中的解決方案
我看到過某些公司的某些頁面，在首屏頁面head的某個<script>中輸出大量的JSON數據
大概是這樣
<script>
var _jsonData = [{a: 1}, {a: 2}, …];
</script>
我猜測大概是想省去首屏發起ajax請求，直接將JSON輸出到頁面中，由JS來完成DOM構建。
這樣在一定程度上提高了首屏渲染速度，前端人員又不用去寫服務端程序
我沒用這種方式，因為沒人管我，我就是這么任性..
Er...更激進的解決方案
關注NodeJS很久了一直沒怎么用，而且NodeJS已經發展了很多年，現在大公司應用的越來越多，可以參考NodeJS應用公司列表-》
做為前端人員，NodeJS真的很容易上手，語法就是JAVASCRIPT么。
聽說淘寶啊什么的前端人員已經開始用NodeJS這么做了，大公司就是先進啊。嗯，我們盛大文學也是大公司-_-!，那么上吧騷年！
用NodeJS來做為橋梁架接服務器端API輸出的JSON。如圖：
瀏覽器(webview)不再直接請求JSP的API，而是
- 瀏覽器請求服務器端的NodeJS
- NodeJS再發起HTTP去請求JSP
- JSP依然原樣API輸出JSON給NodeJS
- NodeJS收到JSON后再渲染出HTML頁面
- NodeJS直接將HTML頁面flush到瀏覽器
這樣，瀏覽器得到的就是普通的HTML頁面，而不用再發ajax去請求服務器了。
這樣做的好處：
- app的WEB頁可以實現離線存儲技術
- 頁面首屏渲染更快
- 由於NodeJS與頁面在同一個域名下，所以就不用跨域了，而不用HTML5輸出頭信息這樣的方式去實現跨域了
- 服務端與客戶端邏輯都由前端人員控制都是使用JAVASCRIPT語言，前端程序猿可以更好的控制和優化，套頁面什么的不容易出錯
- 真正服務端程序人員不需要再關心頁面的渲染邏輯，僅需要關心數據的處理
這樣做的壞處：
- 增加了前端人員的工作
- 前端人員需要對服務端程序有一定的了解
- 服務端需要架起NodeJS服務
- 通過NodeJS架接后台服務過程中通信時間上必然有一部分損失
好在NodeJS安裝比較簡單，各種插件也非常豐富
項目中實際應用經驗
用ExpressJS框架搭建NodeJS的WEB服務感覺棒棒噠！
真的很簡單，三下兩下就搞定了，我這么菜的人都行，說明真的很簡單！
注意點：
頁面中動態部分，如：評論，閱讀人數，贊的人員等這些動態數據還是需要用ajax請求
這些動態數據需要動態的插入DOM中否則這些數據會被離線存儲給緩存住，每次打開都是一樣的數據不會再更新，
除非.appcache文件更新，這樣肯定不合理，嗯對，就是不合理
所以那些動態數據還是可以根據原先的邏輯去直接請求JSP或PHP之類的服務端提供的API接口，當然跨域什么的就看項目需求與項目環境了。
ExpressJS中默認的模板是EJS，而瀏覽器中我使用的是artTemplate.js，好吧我真的喜歡artTemplate.js
一查發現artTemplate也有NodeJS版本的，就這樣服務端與瀏覽器端都可以使用artTemplate來做為渲染模板了，可以說是無縫啊，嘿嘿
最后要說的
第一次在正式項目中使用NodeJS還是挺興奮的，感覺前端的路子又多了一條。
第一次麻，都緊張，都快....
er..就怕由於對NodeJS的不了解最后造成致命的錯誤，而導致項目延期。
現在已經上線了目前只有Android版本，掃一掃即可
===================================================================
轉載處請注明：博客園(池中物,王二狗)willian12345@126.com