作者：京東科技 杜強強

前言

在Roma跨端方案中，JS虛擬機是框架的核心，負責執行動(dòng)態(tài)化的JS代碼。在Android平臺采用了基于V8的J2V8，iOS平臺則使用了系統自帶的JSCore，而在HarmonyOS中，由于業(yè)界無(wú)類(lèi)似的框架，我們需要自行實(shí)現以確保核心基礎能力的完整。 鴻蒙虛擬機的開(kāi)發(fā)經(jīng)歷了從最初 ArkTs2V8 到JSVM + Roma新架構方案。在此過(guò)程中，我們實(shí)現了完整的鴻蒙版的“J2V8”和 基于系統JSVM的JS虛擬機框架，解決了JS引擎庫移植、多語(yǔ)言通信能力、多類(lèi)型數據結構轉換等眾多挑戰。本文將從實(shí)現的各個(gè)階段過(guò)程出發(fā)，探討在實(shí)踐中遇到的問(wèn)題及解決方案。

一、鴻蒙版 “J2V8”虛擬機實(shí)現 - ArkTs2V8

ArkTs2V8框架依賴(lài)V8引擎， 鴻蒙前期交叉編譯資料少，V8官方也未有HarmonyOS端編譯方式。因此在這過(guò)程中， 我們采取初期使用QuickJS引擎(C語(yǔ)言開(kāi)發(fā)，代碼少，移植方便)， 后期自編譯V8完成后替換QuickJS， 保證快速驗證跨端前期技術(shù)調研方案以及其他依賴(lài)項基礎能力的開(kāi)展。 自編譯V8 通過(guò)學(xué)習交叉編譯相關(guān)技術(shù)，摸索式逐步解決編譯期間這種報錯，完成V8虛擬機移植。

ArkTs2V8 架構借鑒了Android J2V8(動(dòng)態(tài)化-J2V8文章中講述了具體原理及實(shí)踐)的實(shí)現原理。 J2V8為針對V8的 Java實(shí)現，采用最直接的方式在Java中訪(fǎng)問(wèn)V8原始值，因此具備較高的性能。 在HarmonyOS中，采用V8作為JS引擎， JSI作為通信層完成設計。

1、引入JSI

考慮到跨端框架的未來(lái)發(fā)展，雖然通過(guò)C++ 能夠直接與V8交互，但這種方式不利于虛擬機代碼的共享和擴展。因此Roma框架引入JSI，以增強代碼的可擴展性，促進(jìn)更有效的代碼共享，并實(shí)現更靈活的虛擬機集成。

JSI（JavaScript Interface），輕量級，通用且同步的JavaScript接口， 通過(guò)JSI，JS代碼可以直接與C++原生代碼通信。

有了JSI層對虛擬機的封裝，Roma框架開(kāi)發(fā)者無(wú)需在關(guān)心虛擬機底層能力， 同時(shí)也可以自由切換引擎，比如使用V8，QuickJS、JSVM等, 規范了數據格式，統一為JSIValue。

2、API與框架設計原理

接口設計采用和J2V8 類(lèi)似的設計，支持多虛擬機實(shí)例方式。

實(shí)現原理：

1、本地接口： 使用 napi 使用創(chuàng )建橋梁， 完成本地代碼調用Quick引擎函數。

2、C++數據綁定：在C++層面 ，定義虛擬機交互操作的相關(guān)函數，完成V8引擎相關(guān)API 來(lái)執行JS代碼、 處理JS對象和執行虛擬機相關(guān)的操作。

3、JSIRuntime: 在C++層面引入JSI概念，通過(guò)完成JSIRuntime - QuickJSRuntime & V8Runtime， 完成虛擬機層通信能力。

4、虛擬機對象的定義及封裝：根據JS數據類(lèi)型，定義ArkTS數據結構，包括基本數據類(lèi)型、JSObject、JSArray、JSFunction。ArkTS側 類(lèi)型對象持有C++ JSIValue 對象指針，當執行具體能力時(shí)，通過(guò)napi 傳遞指針，完成具體功能的調用。 簡(jiǎn)單來(lái)說(shuō)，相當于A(yíng)rkTS JS對象代理C++ 虛擬機數據對象。

5、內存管理： ArkTs2V8負責管理ArkTS與JSValue 之間的內存交互。其中C++側完成JSValue對象的創(chuàng )建、引用持有與銷(xiāo)毀。 ArkTS數據對象中定義對象釋放函數， 數據使用完后，由ArkTS調用釋放內存。

ArkTs2V8架構設計支持虛擬機多實(shí)例， 單個(gè)虛擬機的創(chuàng )建過(guò)程時(shí)由 ArkTs通過(guò)JSEngine發(fā)起創(chuàng )建JSRuntime虛擬機實(shí)例創(chuàng )建，經(jīng)過(guò)napi，在C++環(huán)境創(chuàng )建JSRuntime引擎實(shí)例及引用， 并完成環(huán)境Context及global的初始化， 同時(shí)創(chuàng )建ArkTs JSRuntime對象，代理C++虛擬機對象JSRuntime(QuickJSRuntime or V8Runtime) 并綁定指針引用。

初始化過(guò)程：

V8Runtime實(shí)現

3、JS、JSI、JSRuntime 關(guān)系

JSRuntime (QuickJSRuntime or V8Runtime) 是 JS運行時(shí)環(huán)境。一個(gè) JSRuntime 通常包括一個(gè)或多個(gè)引擎，JSI 可以看作是連接 JS 代碼和 JSRuntime 的橋梁。通過(guò) JSI，開(kāi)發(fā)者可以更直接地與 JSRuntime 交互，實(shí)現原生功能的調用和管理。

4、部分過(guò)程剖析

ArkTs2V8實(shí)現的過(guò)程中，最基礎的兩個(gè)功能原理：JSObject對象的創(chuàng )建與獲取、原生方法的注入， 這兩個(gè)能力的實(shí)現可以擴展到其他大多數API功能實(shí)現上。

1、JSObject對象及獲取對象數據過(guò)程。

通過(guò)JSRuntime 發(fā)起接口的調用，通過(guò)napi，根據對象類(lèi)型在C++側創(chuàng )建對象的JSValue對象及象指針引用， 并將引用指針綁定至ArkTS對象，完成對象的創(chuàng )建。

2、 JS虛擬機注入原生方法

ArkTS方法到JS虛擬機中，主要實(shí)現原理:

將ArkTs的方法 和 目標注冊對象指針 生成MethodDescriptor方法描述對象， 通過(guò)functionID將對象存儲在當前JSContext環(huán)境中。 通過(guò)napi 發(fā)起在C++側代理函數HostFunction的創(chuàng )建，并綁定ArkTs的方法的引用。 進(jìn)入到JSI內部，創(chuàng )建方法代理HostFunctionProxy 對象，綁定代理方法HostFunction及守護函數Finalizer, v8::External 將HostFunctionProxy與 JS環(huán)境對象(V8對象) 關(guān)聯(lián)起來(lái)，生成V8 Function ， 此時(shí)V8函數會(huì )與HostFunctionProxy生命周期綁定。 簡(jiǎn)單來(lái)說(shuō)相當于A(yíng)rkTS callback，傳遞至C++，C++創(chuàng )建JSI Callback并綁定ArkTS callback， JSI Callback 設置到HostFunctionProxy中，HostFunctionProxy 通過(guò) v8::External與 JS環(huán)境綁定。

當JS觸發(fā)該該函數時(shí)，通過(guò)v8::External綁定HostFunctionProxy這層關(guān)系，HostFunctionProxy中JSI Callback會(huì )收到JS環(huán)境的響應消息，在通過(guò)綁定的ArkTs的方法 通過(guò)napi接口返回至ArkTS中，最終ArkTS收到方法響應。

這種代理函數的實(shí)現， 初次學(xué)習可能比較復雜，但整個(gè)過(guò)程實(shí)際是多個(gè)對象間引用的持久化和不同數據對象的交換， 大致過(guò)程圖如下:

4、問(wèn)題及挑戰

1、 數據對象的內存管理

手動(dòng)內存管理。 ArkTs2V8 負責管理ArkTS與V8之間的內存交互中，ArkTs發(fā)起對象的創(chuàng )建和銷(xiāo)毀。 整個(gè)內存的管理是基于手動(dòng)管理，需使用方用完后及時(shí)關(guān)閉，避免內存泄露。 這種設計模式下，使用者操作不當極為容易造成內存泄露，并且使用也較為不便。

針對這問(wèn)題，在后續的迭代設計中，將內存管理升級為自動(dòng)內存管理的方式。 JS為單線(xiàn)程執行，單方法片段或一些邏輯中，如果有了調用開(kāi)始時(shí)機和結束調用時(shí)機， 通過(guò)開(kāi)始時(shí)記錄當前時(shí)刻后開(kāi)始創(chuàng )建的對象，在調用結束時(shí)刻對記錄的對象進(jìn)行統一的內存釋放，類(lèi)似于標記垃圾回收，完成內存的統一管理。借助Roma框架中對虛擬機層的封裝，做到了內存自動(dòng)管理。

2、 跨語(yǔ)言性能問(wèn)題

基于A(yíng)rkTs2V8 的API實(shí)現，在原生、JS環(huán)境中，無(wú)法直接使用對方的數據類(lèi)型，二者之間數據類(lèi)型需要轉換。 JS到原生的過(guò)程中，ArkTs2V8中目前提供的API僅可以獲取當前層級的JS對象數據，子對象數據需要通過(guò)遞歸遍歷從JS環(huán)境中一一獲取。因此解析的過(guò)程中需要頻繁的通過(guò)C++讀取V8，當數據量較大時(shí)通常比較耗時(shí)。拿常用的網(wǎng)絡(luò )模塊來(lái)說(shuō)，接口下發(fā)的業(yè)務(wù)接口數據至少都在幾K甚至幾十K，轉為JS對象在中端性能手機上 會(huì )有幾十ms的耗時(shí)，這對單線(xiàn)程模式的JS環(huán)境來(lái)說(shuō)影響時(shí)巨大的。

ArkTS 、C++ 跨語(yǔ)言通信性能我們可以采取類(lèi)似于Roma Android的通信次數壓縮策略，或者使用JSON序列化來(lái)減少跨語(yǔ)言交互的性能損耗， 但無(wú)論用哪種都僅是從行為上規避跨語(yǔ)言的性能，而無(wú)法徹底解決。

3、 線(xiàn)程管理問(wèn)題

ArkTS基于TS語(yǔ)言，由于語(yǔ)言特性，ArkTS線(xiàn)程隔離，那么對于A(yíng)rkTs2V8這種接口設計并不友好。 JS線(xiàn)程需要在A(yíng)rkTS開(kāi)啟獨立worker JS線(xiàn)程，收發(fā)JS消息，線(xiàn)程間的隔離，涉及再次序列化數據影響性能。

基于問(wèn)題2、3 以及對框架未來(lái)的思考，Roma鴻蒙端決定采用新的方案： 框架C++化，框架邏輯實(shí)現全部放在native側， 虛擬機實(shí)現全部切C++，C++側完成線(xiàn)程管理，ArkTS不在承擔線(xiàn)程和邏輯任務(wù)。 這種既提升了解決了問(wèn)題，提升框架性能，也為今后框架移植其他平臺打好基礎。

二、基于JSVM虛擬機實(shí)現 (Roma新架構)

1、鴻蒙JSVM

在V8移植上，從短期看雖然我們初步掌握了V8交叉編譯移植技術(shù)，但從穩定性、兼容性、維護成本、包大小等維度看， 采用系統內置虛擬機有巨大的長(cháng)期收益。 年初Roma框架與華為專(zhuān)家多次溝通交流，最終HarmonyOS將V8內置到了操作系統， Q2我們實(shí)現了第三個(gè)JSRuntime - JSMVRuntime， 至此鴻蒙動(dòng)態(tài)化架構修改趨于穩定。

JSVMRuntime:

2、新架構思路 - Roma架構C++化

新架構的設計思路SDK核心邏輯整體C++側實(shí)現， 這樣在底層引擎與核心流程之間可以直接c++通信，線(xiàn)程間上與其他端保持相同 - 三線(xiàn)程模型JS線(xiàn)程 +UI線(xiàn)程 + 耗時(shí)計算線(xiàn)程。通過(guò)C++ PThread完成線(xiàn)程管理， 從而避免跨語(yǔ)言、ArkTS線(xiàn)程隔離帶來(lái)的多種性能損耗。 在數據結構設計上， JS數據采用JSI::Value， 與其他線(xiàn)程數據相互交互時(shí)， 統一使用folly完成。 另外將虛擬機層下沉，對外提供JSExecutor， 功能開(kāi)發(fā)時(shí)框架開(kāi)發(fā)者無(wú)需關(guān)心虛擬機層的實(shí)現。

虛擬機方法與對象的注入上， 通過(guò)HostObject代理對象能力的雙邊映射，原生模塊直接與JS 同步或異步交互， 從而縮短了流程鏈路。

框架大致原理:

3、過(guò)程遇到的

1、JSVM字符串引用問(wèn)題

JSVMRuntime實(shí)現期間，字符串無(wú)法創(chuàng )建對象引用。 JSI的設計中將字符串作為 pointer 自定義指針類(lèi)，通過(guò)指針地址訪(fǎng)問(wèn)， 與其相同的還有對象，方法。 在許多語(yǔ)言中字符串都作為一種特殊的類(lèi)型(非基本數據類(lèi)型)， 例如在C++中，字符是一種基本數據類(lèi)型，但是字符串不是，字符串由字符組成， V8引擎亦如此。 V8中通常使用v8::String來(lái)創(chuàng )建JS字符串， 我們可以對齊進(jìn)行持久化引用。

而JSVM中 OH_JSVM_CreateReference 無(wú)法針對字符串類(lèi)型創(chuàng )建引用， 字符串的持久化需從JSVM_Value從copy出來(lái)通過(guò)智能指針或者new內存的方式進(jìn)行存儲，這種copy持久化的方式會(huì )造成字符串內存兩份(JSVM一份，自己存一份)， 實(shí)際開(kāi)發(fā)中大量的字符串類(lèi)型轉換，這樣會(huì )造成內存占比過(guò)高。

為此， 經(jīng)過(guò)與華為專(zhuān)家多次交流溝通，最終將字符串歸為引用類(lèi)型，可通過(guò)OH_JSVM_CreateReference持久化引用，修改后的方式如下：

2、HostObject代理對象實(shí)現

HostObject 是JS對象，提供與原生直接通信的方式。 相當于 native 在 JS的代理對象，雙向映射，原生模塊直接與JS 同步或異步交互， 在一些功能實(shí)現上可以縮短流程鏈路， 在JS中可直接調用C++的對象。 在動(dòng)態(tài)化中， 模塊的實(shí)現采用的就是HostObject能力， 框架層實(shí)現模塊代理對象及橋通信層面的雙向通信過(guò)程。 比如登錄模塊，在A(yíng)rkTS側封裝模塊的API，通過(guò)C側的HostObject映射，可以在JS中直接調用登錄模塊的登錄，退出登錄等能力。 HostObject的實(shí)現，雖然在框架層面相比于喬通道的方式更加復雜，但對于復雜邏輯流程和交互鏈路， 基礎開(kāi)發(fā)可以更注重于功能邏輯。

HostObject 實(shí)現過(guò)程較為復雜， 但我們可以將過(guò)程拆分，通過(guò)對象管理 + 代理函數的方式將過(guò)程簡(jiǎn)化。 首先對象的管理直接JSRuntime中持久化即可，Roma中采用智能指針，那么就剩下代理函數，前面我們講了JS中注入方法里面包括了代理函數的實(shí)現原理，采用類(lèi)似的思路來(lái)完成HostObject。

HarmonyOS提供的JSVM API最初僅支持代理函數的創(chuàng )建， 而我們需要是創(chuàng )建代理對象，對象中可以有任意方法，僅通過(guò)代理函數方式無(wú)法滿(mǎn)足任意方法的需求，為此通過(guò)在JS中注入代理對象腳本實(shí)現，通過(guò)Proxy代理的方式，將get、set等代理對象的方法通過(guò)代理函數的方式返回，這種情況下，我們的函數數量就被簡(jiǎn)化成了get、set及一些固定的方法。 通過(guò)這些方法做代理轉接，調用到C++對象方法，借助JSI::Value的包裝，將具體結果返回。

JS代理腳本部分代碼：

大致實(shí)現過(guò)程：

示例 - 基于HostObject Console能力實(shí)現

三、總結

0到1實(shí)現鴻蒙版“j2v8”、“JSRuntime” 讓我們更加了解引擎實(shí)現中的各種細節和一些難點(diǎn)問(wèn)題的解決。 一些方案的實(shí)現，也可以延展到其他(非虛擬機)場(chǎng)景。 Roma 框架C++， 讓Roma框架走向技術(shù)深水區， 為今后capi、未來(lái)技術(shù)做好了基礎，旨在帶來(lái)更優(yōu)的性能和更好的用戶(hù)體驗。

審核編輯 黃宇