鴻蒙系統中的 JS 開發框架

今天鴻蒙終於釋出了，開發者們也終於“沸騰”了。

原始碼託管在國內知名開源平臺碼雲上，

我也第一時間下載了原始碼，研究了一個晚上，順帶寫了一個 hello world 程式，還順手給鴻蒙文件提了 2 個 PR。

當然我最感興趣的就是鴻蒙的 JS 框架 ace_lite_jsfwk，從名字中可以看出來這是一個非常輕量級的框架，官方介紹說是“輕量級 JS 核心開發框架”。

當我看完原始碼後發現它確實輕。其核心程式碼只有 5 個 js 檔案，大概也就 300-400 行程式碼吧。（沒有單元測試）

• runtime-core\src\core\index.js

• runtime-core\src\observer\observer.js

• runtime-core\src\observer\subject.js

• runtime-core\src\observer\utils.js

• runtime-core\src\profiler\index.js

從名字可以看出來，這些程式碼實現了一個觀察者模式。也就是說，它實現了一個非常輕量級的 MVVM 模式。透過使用和 vue2 相似的屬性劫持技術實現了響應式系統。這個應該是目前培訓班的“三大自己實現”之一了吧。（自己實現 Promise，自己實現 vue，自己實現 react）

utils 裡面定義了一個 Observer 棧，存放了觀察者。subject 定義了被觀察者。當我們觀察某個物件時，也就是劫持這個物件屬性的操作，還包括一些陣列函式，比如 push、pop 等。這個檔案應該是程式碼最多的，160 行。observer 的程式碼就更簡單了，五六十行。

而當我們開發的時候，透過 Toolkit 將開發者編寫的 HML、CSS 和 JS 檔案編譯打包成 JS Bundle，然後再將 JS Bundle 解析執行成C++ native UI 的 View 元件進行渲染。

“透過支援三方開發者使用宣告式的 API 進行應用開發，以資料驅動檢視變化，避免了大量的檢視操作，大大降低了應用開發難度，提升開發者開發體驗”。基本上就是一個小程式式的開發體驗。

在 src\core\base\framework_min_js.h 檔案中，這段編譯好的 js 被編譯到了 runtime 裡面。編譯完的 js 檔案不到 3K，確實夠輕量。

js runtime 沒有使用 V8，也沒有使用 jscore。而是選擇了 JerryScript。JerryScript 是用於物聯網的超輕量 JavaScript 引擎。它能夠在記憶體少於 64 KB 的裝置上執行 ECMAScript 5.1 原始碼。這也是為什麼在文件中說鴻蒙 JS 框架支援 ECMAScript 5.1 的原因。

從整體看這個 js 框架大概使用了 96% 的 C/C++ 程式碼，1.8% 的 JS 程式碼。在 htm 檔案中寫的元件會被編譯為原生元件。而 app_style_manager.cpp 和同級的七八個檔案則用來解析 css，最終生成原生布局。

雖然在 SDK 中有幾個 weex 包，也發現了 react 的影子。但是在 C/C++ 程式碼中並沒有看到 yoga 相關的內容（全域性搜尋沒發現）。而 SDK 中的那些包僅僅是做 loader 用的，大概是為了在 webpack 打包時解析 htm 元件用的。將 htm 的 template 編譯為 js 程式碼。

整體而言，比我預想的要好一些。

轉自https://blog.csdn.net/JustJavaC/article/details/108538873?