鸿蒙NEXT开发【ArkWeb渲染框架适配方案】应用框架开发

场景描述

Hybrid应用开发是介于Web应用和原生应用两者之间的应用开发技术，兼具“原生应用良好交互体验”的优势和“Web应用跨平台开发”的优势。其主要原理是由Native通过JSBridge通道提供统一的API，然后用Html/CSS实现界面，JS来写业务逻辑，能够调用系统API，最终的页面在Webview中显示。

Hybrid应用鸿蒙化方案

整体架构

1. Ark进程：由ArkTS引擎提供运行时，具备调用系统API的能力。应用启动从Ark进程进入，完成EntryAbility的初始化并创建鸿蒙应用页面。Ark进程可以动态或者静态创建Webview运行时环境，并加载html/css/js资源文件。
2. Webview进程：默认支持标准W3C API，对原生侧资源的访问有限制。Webview渲染能力主要由鸿蒙Web组件提供。用户可以通过Web组件的属性配置是否开启同层渲染能力、是否允许执行JavaScript脚本等。
3. JSBridge：上述两种进程的通讯机制，允许数据双向流动。Webview进程通过JSBridge通道访问原生拓展API。

方案设计

Hybrid应用鸿蒙化方案主要集中在双端通信JSBridge实现、拓展接口实现，以及基于同层渲染的原生组件实现。JSBridge是前端与原生进行双向通信的桥梁。通过JSBridge，前端应用能访问到原生侧实现的拓展接口，实现更丰富的业务功能。视图层方面，可以使用系统提供的同层渲染能力，把部分性能要求比较高的前端组件改成原生实现，以达到更好的体验效果。下图蓝色背景的方框图展示了上述三点所处的框架位置：

业务实现中的关键点

Hybrid应用鸿蒙化方案主要围绕双端通信、API鸿蒙化、组件鸿蒙化三方面进行开发。双端通信：JS侧使用原生能力的通道，是鸿蒙化的基石；API鸿蒙化：针对JS侧平台相关的API，提供一套鸿蒙版本的实现；组件鸿蒙化：针对Web组件，以同层渲染的方式提供替代组件，以提升组件的性能与交互体验。

双端通信

JSBridge扮演Webview进程与原生ArkUI主进程沟通的桥梁，是一种双向通信的机制。HarmonyOS系统提供Web组件以及@ohos.web.webview等ArkWeb API来进行Web开发。可以通过WebMessagePort以及javaScriptProxy代理的方式实现JSBridge。