面向UI編程框架：ui.js框架思路詳細設計

因爲上一次的靈光一閃，萌生了對面向UI編程的思想實現。通過一段時間的考慮和設計，如今將思想和具體細節記錄下來：

具體思路描述：

1. 在UI.config文件中，配置全部參數，好比頁面模板、全部組件、組件控制、接口注入
2. ui.js根據配置文件中所選擇的模板，進入佈局模板庫中找到所加載的模板
3. 將模板首先注入頁面之中。
4. ui.js分析頁面模板佈局中所須要加載的組件以及其餘操做，將這些組件數據注入到數據中轉池
5. 而後數據中轉池，將組件信息傳遞給ui.js，須要哪些組件和操做
6. ui.js將中轉池傳過來的組件信息經過配置文件從組件庫中去尋找
7. 尋找到模板所需組件注入頁面，數據中轉池配合組件的js，對組件進行初始化。直到頁面加載完成

 

配置文件的配置設計：

UI.config=({
    //配置路徑
    baseUrl:"/",
    //注入模塊
    template:{
        //佈局模板名稱：模板地址+是否裝載
        "layout1":["layout/layout1.tpl",true],
        "layout2":["layout/layout1.tpl",false]
    },
    //注入接口
    interface:{
        "interface1":"www.123.com/interface1",
        "interface2":"www.123.com/interface2",
        "interface3":"www.123.com/interface3",
        "interface4":"www.123.com/interface4",
        "interface5":"www.123.com/interface5",
    },
    //注入組件
    module:{
        //組件名：組件地址+組件是否裝載+接口注入
        "md1":["module/header.mold",true,["interface1","interface2"]],
        "md2":["module/body.mold",true,["interface1","interface2"]]
    },
    //組件邏輯js
    data:{
        //js所需接口和其餘數據都需數據中轉池配合
        "md1_js":"modulejs/md1.js"
    }
});

　　

 數據中轉池設計思路：

具體思路描述：

1. 每一個組件在配置文件中生成以後，導入ui.js中處理後，會生成每一個組件對應的uuid（惟一標識）
2. 在進行數據流轉和互通的時候，必須經過uuid進行存儲和使用
3. 對於只使用一次和永久存放的數據進行標記和回收
4. 配合組件進行變動，組件加載數據加載，組件卸載數據卸載
5. ...

 

面向UI思想框架優點：

1. 高度複用html，若是一個更通用的模板，能夠無限次複用（能夠更換接口）
2. 靈活變動網頁佈局。傳統頁面都是佈局好了以後沒法變動，UI引入佈局模板，能夠隨意進行佈局，只要最後引入組件正確便可
3. 對全部接口進行了統一管理，每一個組件進行分別注入，按需使用
4. 可進行全球分佈協做開發，每一個組件配置地址能夠在互聯網的任何角落，我只須要按着地址能夠取到個人組件和處理js便可
5. 可一個項目，由互聯網上各處的組件拼湊完成,若是後臺可支持跨域，那麼一個項目先後臺均可是互聯網上的資源，而咱們部署的服務器只是提供一個展現入口
6. 開發只須要專一每一個組件開發便可，一個一個組件開發，開發完成經過配置裝載上線
7. 對於項目局部進行更新，可直接卸載一個組件，不須要關閉整個服務器。更新完成以後，更新組件，從新裝載上線
8. 每一個企業可維護本身的一套組件庫，高度複用。新項目若是遇到之前開發過的組件直接配置路徑和參數使用。
9. 可將配置文件參數經過後臺獲取，動態維護全部組件。方便運維
10. 對於接盤俠（維護人員）來講，有更方便和快捷的方式進行處理（局部組件開發規範參考自我總結的高效開發和維護方案）
11. 更使用於單頁應用，由於只有針對於局部刷新，加載速度比通常網頁速度更快
12. ...我惟一能想到的就這麼多，我會將這個項目開源，但願更多的志同道合的人，一塊兒開發更強大的UI.js

 

 PS：如今只是對思路作一個詳細設計，在開發中可能會遇到各類各樣的問題，並且該思路是個人第一次起草，可能不是很完善，若是你們有更好的思想和靈感，但願你們不吝賜教。這段時間先把基礎版本寫好，而後公佈成開源項目出去，之後歡迎你們一塊兒完善。

下面是個人手稿：

 

 

我是碼農，我不喜歡被代碼玩弄，我喜歡用代碼去改變世界，但願這世界更美好！！！加油，共勉！！！！