本文是《構(gòu)建高可伸縮性的WEB交互式系統(tǒng)》系列文章的第三篇，以網(wǎng)易的NEJ框架為例，對(duì)模塊的可伸縮性進(jìn)行分析介紹。

　　實(shí)例分析

　　NEJ框架根據(jù)前兩篇的描述對(duì)此套架構(gòu)模式做了實(shí)現(xiàn)，下面我們用具體實(shí)例講解如何使用NEJ中的模塊調(diào)度系統(tǒng)來(lái)拆分一個(gè)復(fù)雜系統(tǒng)、開(kāi)發(fā)測(cè)試模塊、整合系統(tǒng)等。

　　系統(tǒng)分解

　　繪制層級(jí)關(guān)系圖

　　當(dāng)我們拿到一個(gè)復(fù)雜系統(tǒng)時(shí)，根據(jù)交互稿可以繪制出組成系統(tǒng)的模塊的層級(jí)關(guān)系圖，并確定系統(tǒng)對(duì)外可訪問(wèn)的模塊。

　　抽象依賴(lài)關(guān)系樹(shù)

　　從模塊的層級(jí)關(guān)系圖中，我們可以非常方便的抽象出模塊的依賴(lài)關(guān)系樹(shù)：

　　然后，我們將抽象出來(lái)的依賴(lài)關(guān)系樹(shù)根據(jù)UMI規(guī)則進(jìn)行格式化。格式化的主要操作包括：

• 增加一個(gè)名稱(chēng)為“/”的根結(jié)點(diǎn)（也可將“m”結(jié)點(diǎn)改為“/”）
• 每個(gè)結(jié)點(diǎn)增加“/”的子節(jié)點(diǎn)作為默認(rèn)節(jié)點(diǎn)

　　至此輸出的依賴(lài)關(guān)系樹(shù)，具有以下特性：

• 任何一個(gè)結(jié)點(diǎn)（除根結(jié)點(diǎn)外）到根結(jié)點(diǎn)路徑上的結(jié)點(diǎn)名稱(chēng)用“/”分隔組合起來(lái)即為結(jié)點(diǎn)的UMI值，如list結(jié)點(diǎn)的UMI值為/m/blog/list
• 任何結(jié)點(diǎn)上的模塊都依賴(lài)于他祖先結(jié)點(diǎn)（注冊(cè)有模塊）上的模塊存在，如blog結(jié)點(diǎn)和list結(jié)點(diǎn)均注冊(cè)有模塊，則list結(jié)點(diǎn)上的模塊顯示必須以blog結(jié)點(diǎn)上的模塊的顯示為先決條件

　　確定對(duì)外模塊注冊(cè)節(jié)點(diǎn)

　　五個(gè)對(duì)外可訪問(wèn)的模塊：日志、標(biāo)簽、基本資料、個(gè)人經(jīng)歷、權(quán)限設(shè)置，在依賴(lài)關(guān)系樹(shù)中找到合適的結(jié)點(diǎn)（葉子結(jié)點(diǎn)，層級(jí)關(guān)系樹(shù)在依賴(lài)關(guān)系樹(shù)中對(duì)應(yīng)的結(jié)點(diǎn)或“/”結(jié)點(diǎn)）來(lái)注冊(cè)對(duì)外可訪問(wèn)的模塊：

　　確定布局模塊注冊(cè)節(jié)點(diǎn)

　　從可訪問(wèn)模塊注冊(cè)的結(jié)點(diǎn)往根結(jié)點(diǎn)遍歷，凡碰到兩模塊交叉的結(jié)點(diǎn)即為布局模塊注冊(cè)結(jié)點(diǎn)，系統(tǒng)所需的組件相關(guān)的模塊可注冊(cè)到根結(jié)點(diǎn)，這樣任何模塊使用的時(shí)候都可以保證這些組件已經(jīng)被載入。

　　映射模塊功能

　　原則：結(jié)點(diǎn)的公共父結(jié)點(diǎn)實(shí)現(xiàn)結(jié)點(diǎn)上注冊(cè)的模塊的公共功能。

　　舉例：blog結(jié)點(diǎn)和setting結(jié)點(diǎn)的公共父結(jié)點(diǎn)為m結(jié)點(diǎn)，則我們可以通過(guò)切換blog模塊和setting模塊識(shí)別不變的功能即為m模塊實(shí)現(xiàn)的功能，同理其他模塊。

　　分解復(fù)雜模塊

　　進(jìn)一步分解復(fù)雜模塊，一般需要分解的模塊包括：

• 可共用模塊，比如日志列表，可以在日志管理頁(yè)面呈現(xiàn)，也可以在彈層中顯示
• 邏輯上無(wú)必然聯(lián)系的模塊，如日志模塊中日志列表與右側(cè)的按標(biāo)簽查看的標(biāo)簽列表之間沒(méi)有必然的聯(lián)系，任何一個(gè)模塊的移除或添加都不會(huì)影響到另外一個(gè)模塊的業(yè)務(wù)邏輯

　　至此我們可以得到兩棵系統(tǒng)分解后的依賴(lài)關(guān)系樹(shù)——對(duì)外模塊依賴(lài)關(guān)系樹(shù)：

　　以及私有模塊依賴(lài)關(guān)系樹(shù)：

　　繪制模塊功能規(guī)范表

　　本例中為了說(shuō)明分解過(guò)程，將所有可分解的模塊都做了分解。實(shí)際項(xiàng)目看具體情況，比如這里的/m模塊組合的/?/tab/模塊的功能可以直接在/m模塊中實(shí)現(xiàn)，而不需要新建一個(gè)/?/tab/模塊來(lái)實(shí)現(xiàn)這個(gè)功能。

　　規(guī)范表范例如下所示：

　　構(gòu)建目錄

　　項(xiàng)目目錄

　　項(xiàng)目目錄的構(gòu)建如下圖所示：

　　各目錄說(shuō)明

webroot                    項(xiàng)目前端開(kāi)發(fā)相關(guān)目錄   |- res                  靜態(tài)資源文件目錄，打包時(shí)可配置使用到該目錄下的靜態(tài)資源帶版本信息   |- src                  前端源碼目錄，最終發(fā)布時(shí)該目錄不會(huì)部署到線上       |- html            |- module      單頁(yè)面模塊目錄，系統(tǒng)所有模塊的實(shí)現(xiàn)均在此目錄下            |- app.html    單頁(yè)面入口文件

it知識(shí)庫(kù)：構(gòu)建高可伸縮性的WEB交互式系統(tǒng)（下），轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。