（本文初始發佈於我的博客

Kyles' Garden

）

LiKy 是什麼

這是在經過我幾番推（an）廣（li）之後被問到最多的問題。

這玩意是一個知道的人在開口之前就無需贅述的東西（是的，貴圈的思維回路已經和外界不在一個次元瞭）。簡單說 MVVM Library 可以讓你在處理代碼時隻關心模型層的東西，然後把一切 handling the UI things 交給這個 Library 就好。所以現在非常多場景的任務（重數據與展示）可以被處理地異常輕巧與簡單，以往那種非常臟且累的處理表單，顯示表格，保持各處 UI 同步的工作現在一個做 Server 端的同學就可以完成。

已經有一系列非常流行的 MV* Library/Framework 瞭。從五年前的 Angular （那個時候還是 MVC Framework），到三年前的 React 再到如今勢頭正盛的 Vue （以及它們異常快速的迭代版本與輔助工具）。而 LiKy 是它們中新的一員。

LiKy 的設計是怎樣的

LiKy 目前仍然是我的一個實驗，它的想法最早來自於 Spine 。

Spine 的作者寫過一本 JavaScript Web Applications，從當時的角度比較詳細地介紹瞭一個 MVC 庫的設計與實現（雖然 Spine 已經幾乎不再維護瞭）。 LiKy 的初始版本就是在 Spine 的基礎上搭建的，包括 VM 繼承，利用 Template 實現單向綁定，以及事件代理。

從現在的角度來看 Spine 確實非常過時瞭：Spine 大量依賴 jQuery 與 jQuery Template；混入瞭很多今天看來並沒有什麼用的功能；給開發者的接口並不清晰與友好。為此在 Model 寫完之後我就沒有再繼續參考這本書的實現瞭。

現在 LiKy 的接口更多地參考瞭 React 與 Vue 這兩個庫。首先 React 的設計非常清晰，從 state 訪問 model 與 setState 設置狀態可以看出 keep the state tiny 的想法，將改變一次性收集起來然後 render 也是從這裡面出來的；根元素綁定，自定義事件綁定，模板引擎語法的接口參考瞭 Vue （ Vue 的設計品味真的非常棒 ）。

雖然 LiKy 參考瞭這些流行框架好的想法，不過具體實現我還是按照自己的思路來，現階段的 LiKy 主要由以下幾個部分構成：

• Class ： 提供瞭類的繼承；擴展實例與靜態屬性；方法代理
• Persistence ：提供瞭遠程、本地數據持久化的能力
• Model ： 一個純數據層，由 Class 產生；增加瞭靜態屬性，實例屬性合並瞭 Persistence，增加瞭實例生命周期的各種鉤子，增加瞭 state 和與之相關的方法接口
• Selector ：一個包裝瞭瀏覽器原生接口的類 jQuery 接口，提供瞭 DOM 遍歷，內容訪問，替換與事件代理能力
• Template ： 一個專門為 LiKy 制作的模板引擎，提供瞭值替換 + 轉義，循環，條件語句
• ViewModel ：LiKy 的核心；由 Model 產生，利用瞭 Selector 與 Template；提供瞭單/雙向數據綁定與 DOM 事件監聽的能力

其中關於 ViewModel 的實現可以參考 這篇答案 。

一開始 LiKy 依賴於 jQuery 與 Whiskers，但是我想保持 LiKy 的輕量與可定制，於是經過瞭一番探索後通過 Selector 與 Template 解除瞭依賴。最終的結果就是你看到瞭一個獨立且僅有 13 KB 的庫。

所以我在做什麼

LiKy 無意於挑戰目前競爭非常激烈的 MV* Library/Framework 巨頭。今天凌晨 Vue 2.0 宣佈瞭很多 激動人心的特性，我知道在我面前又橫亙瞭一個無比強大且值得學習的對手。

LiKy 初始的目標就是 Just For Fun；其次的目標是在這個過程中體會到這些 MV* Library/Framework 背後的想法與實現從而幫助自己學習（是的我得瞭一種不自己入手就無法完全理解這玩意的病）；最後的目標是，如果確實有人從 LiKy 這個輪子上受到啟發甚至玩的開心，當然是最好的事情。

後續我要做什麼

後續我的首要目標是…畢設 =_=，一個沒什麼深度除瞭處理起來比較麻煩外不值一提的東西。

再往後我想實現一個 Front-End Framework，這玩意的名字暫且叫 Uton-Like，已經列好瞭 提綱 。這是一個未來可能用於站點 Uton 的佈局框架（至於 Uton 是什麼 … =_=，它是 梧桐 這個殘骸的新版本，一個集成文章分享與小組即時討論的平臺）。

LiKy 也會繼續，主要關註於 Bug 修復 & 性能提升，以及新平臺 render 的可能性。

以上 =_,=