本文转载自 OpenHarmony TSC 官方微信公众号《峰会回顾第3期 | 面向万物智联的应用框架的思考与探索》

演讲嘉宾 | 余枝强

回顾整理 | 廖 涛

排版校对 | 李萍萍

嘉宾简介

余枝强，OpenHarmony 技术指导委员会跨平台应用开发框架 TSG 负责人，华为终端软件部应用程序框架首席架构师，华为 Web 技术 C-TMG 主任。主导 OpenHarmony / HarmonyOS UI 开发框架 ArkUI 的整体规划、架构设计及实现；也曾主导华为浏览器内核、快应用引擎的从零到一构建。在加入华为之前，任职于英特尔公司，曾负责移动平台的 HTML5 引擎—— Crosswalk 开源项目、XML 高性能处理器等项目。

文章内容来源

第一届开放原子开源基金会 OpenHarmony 技术峰会——编程语言及应用框架分论坛

视频回顾

【峰会回顾第3期 | 面向万物智联的应用框架的思考与探索-余枝强-哔哩哔哩】 https://b23.tv/ijSiFUb

正 文 内 容

应用框架，是操作系统连接开发者生态，实现用户体验的关键基础设施。业务的飞速发展促进了应用框架不断演进和变化。在万物智联的新场景下，应用框架应该如何设计呢？华为终端开发框架首席架构师余枝强，在第一届 OpenHarmony 技术峰会上给出了几点思考。

01►业界应用框架的演进

应用是用户使用操作系统/设备的入口，应用框架则是应用开发和运行的基础设施。以移动端为例，一个典型的应用结构一般包括用户界面、业务逻辑、共享库以及包清单文件等部分。

1.用户界面以及相应的业务处理逻辑。这里主要包括构建用户界面所需的 UI（User Interface）组件，布局，动效，事件交互响应处理，所需的资源（图片/字体等），以及结合 UI 呈现的业务逻辑处理等。从运行时的维度来看，它主要对应了系统运行环境中的 UI 框架（含语言运行时），以及部分的系统能力 API (Application Programming Interface)；

2.共享库。这里主要包括开发者封装好的 SDK（Software Development Kit），以及使用的三方库等。从运行时维度来看，它主要对应了系统能力 API 以及语言运行时，如果共享库涉及 UI 的话，还对应了 UI 框架；

3.包清单文件。这里主要包括应用包的结构描述，权限声明等，它主要对应了系统运行环境中的包管理，应用生命周期/权限管理/进程管理等。其中，UI 框架的主要组成如下图所示：

■开发模型：对开发者提供的开发范式、UI 组件/API 能力、编程语言等，重点体现的是开发效率与难易程度；

■运行框架：UI 界面渲染及交互的基础能力框架，将开发者的程序运行在具体系统平台上，包括应用整体渲染处理流程，语言逻辑执行流程，以及平台能力扩展机制，重点体现的是应用运行的性能体验；

■平台适配：承载框架的具体操作系统或平台的适配层。

一般而言，应用框架中的包管理、生命周期/权限管理，和具体的操作系统关联较紧，并相对稳定；能力 API 则是操作系统对设备能力的封装，主要影响应用使用设备的能力。UI 框架以及相应的编程语言则是影响用户体验（包括开发和运行体验）的关键要素，尤其随着移动平台的不断普及以及移动设备的差异，移动平台上的 UI 框架（含编程语言）是业界不断演进的重点领域。

近十年来，业界 UI 编程框架围绕着更好的开发效率，更好的运行体验以及适应更多的平台不断发展演进。其中有三个关键的时间节点：

1.2013 年，Facebook 发布的 React.js 第一次综合的将数据绑定，虚拟 DOM（Document Object Model）等机制引入前端开发框架设计中。开发者只需声明好相应的数据和 UI 的绑定，之后由框架来跟踪数据的变化，并通过虚拟 DOM 树的对比找出变化点，从而实现界面的自动更新，而无需开发者手动基于 DOM 编程。

2.2018 年，Google 发布的 Flutter 则是个重要的分界点。Flutter 融合了 Dart 语言，是第一个深度融合了语言的较为完整的声明式开发框架，实现了完全通过数据驱动的 UI 变更。另外，Flutter 通过基于 Skia 的自绘制引擎实现了高性能的跨平台的平台一致性的渲染能力，并提供了 Hot Reload 机制提升开发测试体验。不过，Flutter 的整体设计哲学偏向底层的灵活性 – 主要通过底层的细粒度的能力供开发者自由组合，另外，Google 对 Dart 语言的简洁度的改进较少，整体上开发的简洁度以及对用户的友好度不足。

3.2019 年，Apple SwiftUI 的推出，意味着主流 OS 的原生应用框架开始逐步往声明式开发方式迁移。SwiftUI 推动了 Swift 语言特性扩展实现了更加简洁自然的 UI 描述，并通过 XCode 开发工具的所见即所得的高效预览能力进一步提升开发效率。同时，SwiftUI 也是真正意义上开始通过一套框架，逐步统一 Apple 生态中的不同的设备/OS 上的应用开发。另外，2019 年 Google 将更简洁的 Kotlin 语言升级为 Android 首选的编程语言，并在 2021 年推出基于 Kotlin 的应用框架 Jetpack Compose, 同时结合开发工具 Android Studio 逐步往多设备以及跨平台演进。

■总体而言，移动端应用框架的演进包含以下几个关键特征：从命令式 UI 开发逐步演进到声明式 UI 开发；

■UI 和编程语言的融合从相对松散演进到逐步紧密；

■开发范围从单设备演进到多设备，从单平台演进到多平台。

02►万物智联下的应用框架的架构设计思考

目前，在万物智联的新场景下，智能设备的数量和种类越来越多，场景也越来越复杂，存在着新需求和新挑战：1.设备间具有不同形态：各设备的屏幕不同，其分辨率、长宽、形状、尺寸等均不相同；2.设备自身的交互方式不同：存在触控、键鼠、遥控、语音、3D 手势等多种形式；3.设备间具有不同的能力：各设备的 CPU、GPU、NPU、蓝牙等处理能力不同，且 RAM、ROM 的规格也不相同；4.设备之间的交互方式也不相同：例如无缝流转、协同等。此外，跨 OS 平台，动态内容部署能力也是重要的需求。

如何设计相应的应用框架来应对挑战呢？以下将从语言选型和框架设计两个维度来讨论。

2.1►►语言选型

如图所示的排行榜显示了在 2012 年至 2022 年的区间里，最活跃、热度最高的前 20 名编程语言，由图可以看出 JavaScript 和 TypeScript 的排名是遥遥领先的，本身拥有非常好的生态基础。但是，JavaScript 和 TypeScript 也有一定的缺陷，比如缺失基于类型系统的运行时优化，AOT 能力，精细化类型以及细粒度的并行化等。

2.2►►框架设计

相应的，现有框架如 Web 引擎、React Native、Flutter 等在各自领域都具备一定的优势，但也存在性能体验及其与生态难平衡、HTML+CSS+JS 三段式开发方式和业界领先的声明式开发（SwiftUI）相比有较大差距的问题。

2.3►►设计思考

尽管业界在语言、框架等各领域都持续进行了相关改进，但始终缺乏系统性的跨越。对于单平台应用框架来说，需要解决开发效率（开发范式、语言、基础库、三方库、调试调优、预览等）、性能体验（性能、内存、功耗、能力完备度等）以及跨设备（不同设备的 UI 适配和能力适配）等核心问题；对于跨平台应用框架来说，需要解决不同平台的代码复用度、性能和体验不一致等核心问题。此外，还需要考虑动态化内容部署机制和应用部署等因素。

03►ArkUI 的创新和实践

OpenHarmony 应用框架围绕如何解决上述问题，设计了 ArkTS 开发语言以及 ArkUI 开发框架，下面将从语言和框架两个维度进行介绍。

3.1►►OpenHarmony 生态开发语言-ArkTS

OpenHarmony 生态开发语言 ArkTS 在 JavaScript 和 TypeScript 的基础上，围绕着极简表达、极致性能的最终目标进一步演进。改进了 JavaScript 和 TypeScript 的运行时，优化了类型信息，扩展了声明式 UI 语法，以及轻量级并行能力。后续会持续演进分布式、严格类型等相关能力。

3.2►►ArkUI 开发框架

ArkUI 整体架构如图所示。最上层提供了自研声明式 UI 范式，也支持类 Web 范式；中间层为方舟编译器和运行时、声明式 UI 后端引擎以及渲染引擎，下层为平台适配层和平台桥接层。此外，ArkUI 开发框架还配套了相应的 IDE 开发工具以及工具链，提升开发体验。

ArkUI 的声明式范式通过语法扩展方法，提供了装饰器、自定义组件、UI 描述、状态管理、内置组件、属性方法以及事件方法等模块，可以根据用户需求灵活组合，从而形成定制化界面。ArkUI 的声明式范式具备简洁自然声明式语法，统一 UI 表达；多态组件/动态布局，简化多设备 UI 适配；多维度状态管理，简化数据传递 &UI 变更等关键特征。其中，多维度状态管理包括组件、页面、全局以及分布式等多个维度，数据与 UI 间的传递方式也支持单向以及双向传递，以满足应用开发的相关诉求。

ArkUI 的运行机制如图所示。其中，以 ArkTS 语言开发的源代码，经过编译工具链和 ArkUI 框架 API 编译，形成中间代码，再通过方舟运行时形成 ArkUI 框架运行时。在整个渲染设计上，ArkUI 提供了扁平化渲染管线、按需渲染、数据绑定以及基于 PGO 的 AOT 等创新能力，提升用户体验以及渲染效率。在跨设备的设计上，ArkUI 提供了响应式组件+响应式能力的响应式布局能力以及自适应组件+自适应能力的自适应布局能力，并且在视觉交互侧也通过分层参数和主题风格、多态组件以及交互归一等进行了交互能力的增强。此外，ArkUI 支持部署至百 K 级、M 级的轻量化设备，通过引擎轻量化改造以及基于目标平台进一步轻量化定制，实现跨设备能力适配。

3.3►►ArkUI 生态

衡量一个应用框架最终是否成功，关键还是要看它对应用开发者生态影响的深度和广度。下图描述了 ArkUI 生态构建思路概览。

如图所示，自底向上，整体生态构建分为四个维度。

1.  框架。这层主要是框架本身的特性完备度以及竞争力，并能够满足关键应用的需求（包括关键自研应用和关键三方应用）。尤其是要通过关键垂类应用（比如电商，地图，游戏等）的突破来进一步完善框架本身。另外，当多个主流 OS 平台会长时间并存的情况下，跨 OS 平台是核心竞争力诉求。框架必须具备相应的能力来进一步提升开发效率。

2.  工具。这层主要是配套开发工具的完备度以及三方主流开发工具的支持度。DevEco 作为 ArkUI 的核心配套工具，需要在整体开发工作流进一步完善，同步，也需逐步推进和三方开发工具的整合，包括 VSCode, 基于 Chrome 浏览器的调试等，进一步方便开发者。

3.  社区。这层主要是通过相应的开源社区（开放原子开源基金会等），以及三方开源库，组件仓库等建设，以及结合主流的组件仓库 NPM（Node Package Manager）等推动 ArkUI 的三方组件的进一步完善。

4.  标准。这层主要是通过标准化的参与，来构建中长线影响力。包括 W3C 相关的标准组织（ArkUI 类 Web 范式的进一步标准化，WebAssembly 的融合探索等），ECMAScript 标准组织（ArkTS 的增强语言特性的进一步标准化等），软件绿色联盟（应用质量标准，原子化服务标准的完善/互通等）。

总之，ArkUI 的整体生态推进策略是以关键应用为牵引，逐步夯实相应能力构建，通过工具、社区协同，并布局标准培育中长线影响力。

04►未来规划

在未来的工作中，ArkUI 开发框架团队将持续围绕生态和竞争力逐步演进，包括跨平台能力、分层对接能力、跨设备适配能力、渲染能力、并行化/资源调度能力等进行增强，不断提高用户体验。期待大家一起助力鸿蒙生态，持续创新，使其能够更好地赋能万物智联新场景。

点击关注了解更多OpenHarmony TSC技术干货内容