語雀知識庫地址：語雀HarmonyOS知識庫
飛書知識庫地址：飛書HarmonyOS知識庫

---

嗨，各位別來無恙吶，我是小白

眾所周知，華為在今年推出了 HarmonyOS 4.0 版本，而在此之前的版本中，HarmonyOS 應用的 UI 就已經使用了自研的框架——方舟開發框架，簡稱 ArkUI

這篇文章我們就來探一探這神秘的 ArkUI 框架有什么魔力

UI 與組件

首先，方舟開發框架為HarmonyOS應用的UI開發提供了完整的基礎設施，包括簡潔的UI語法、豐富的UI功能（組件、布局、動畫以及交互事件），以及實時界面預覽工具等，可以支持開發者進行可視化界面開發

在這里我們要區分清 UI 與組件的概念，防止混淆

• UI(User Interface)，即用戶界面。作為開發者，我們可以將應用的用戶界面設計為多個功能頁面，每個頁面進行單獨的文件管理，并通過路由的方式完成頁面間的調度管理如跳轉、回退等操作
• 組件是 UI 構建與顯示的最小單位，如 列表、網格、按鈕、單/復選框、文本等。通過不同的組件進行組合，就可以做出滿足應用訴求的界面供用戶使用

ArkUI 的兩種開發范式

由于應用的使用場景及技術背景不同，方舟開發框架提供了兩種開發范式，一種是基于 ArkTS 的聲明時開發范式，另一種是兼容 JS 的類 Web 開發范式

聲明時開發范式

采用基于 TypeScript 的聲明式語法擴展而來的 ArkTS 語言，該方式從組件、動畫與狀態管理提供 UI 繪制能力

類 Web 開發范式

該方式保留了經典的HML、CSS、JavaScript三段式開發方式，即使用HML標簽搭建布局、使用CSS描述樣式、使用JavaScript處理邏輯。這種開發方式更符合于 Web 前端開發者的使用習慣，便于快速將已有的Web應用改造成方舟開發框架應用

現如今，在開發 HarmonyOS 應用時，更推薦使用聲明式開發范式來構建 UI

首先，在開發效率上，聲明式開發范式更接近于自然的開發方式，可以很直觀的描述 UI，而無需關心怎樣去繪制與渲染

其次，兩種開發范式的后端引擎和語言運行時是共用的，但是相比類 Web 開發范式，聲明式開發范式不需要 JS 框架進行頁面 DOM 管理，渲染更新鏈路更為精簡，占用內存更少，應用性能更佳

最后，聲明式開發范式會作為官方在后續主推的開發范式，可以為開發者提供更豐富、更強大的能力

當然，不同類型的 HarmonyOS 應用支持的開發范式是不同的，這里官方給出了一張差異表，如下