Dactyl 的工作原理

Dactyl 的工作原理 Divy Srivastava · 2026 年 8 月 26 日 对于法学硕士来说，应用程序开发一直比 Web 开发更难。应用程序往往具有平台风格规范和布局，并且它们需要具有某种特定的外观和感觉。人们可以感觉到应用程序是“原生的”并且是为他们的设备精心设计的。此外，网络是开放和通用的，而应用程序和应用程序商店通常不是这样，这意味着法学硕士在其训练集中的数据相对较少。许多振动编码平台都试图通过本质上的妥协来解决这个问题。他们使用 Expo/React Native、Flutter、甚至只是 webview 生成应用程序。但我们发现这些方法都无法提供最佳的用户体验；你总是会牺牲一些东西，无论是跨平台兼容性、本机小部件、性能还是功能。我们制作 Dactyl 是为了帮助您构建本机应用程序，而无需做出这些妥协。今天，我们介绍 Dactyl 的跨平台 SwiftUI 渲染器（iOS 模拟器的 Wasm 端口）的内部工作原理，以及我们如何将 Apple 生态系统引入 Android 和 Web。 iOS 网页预览 我们选择 Swift 作为 Dactyl 的主要语言，因为它的简单性和定义良好的布局语义。事实上，Dactyl 最初被设计为 iOS 专属的开发平台。在没有 Mac 的情况下预览 iOS 应用程序通常意味着租用一台并流回真实的模拟器：在您看到应用程序之前启动、安装和启动，只要您继续工作就可以计量。这种方法只能在您的预算允许的范围内进行扩展。但是如果您的浏览器中可以有一个模拟器呢？嗯，这将无限扩展。所以我们建造了它。 Dactyl 的预览引擎是 Swift 中 SwiftUI 的重新实现，以及应用程序所需要的框架。实现了大量模块，包括 Charts、SpriteKit、SceneKit、RealityKit、ARKit、MapKit、StoreKit、MusicKit、PencilKit、WidgetKit、UIKit、CoreGraphics、Metal 和 Vision。应用程序是根据 Wasm 构建的，并与我们的 SwiftUI（而不是 Apple 的）链接。引擎将绘制命令的二进制流发送到自己的线性内存中，并且由 JavaScript 主机读取协议，并将其绘制在 Canvas2D 上。布局在写入任何命令之前就已完全解析，并且协调器在传递之间保留视图树，仅将在该帧中实时读取内容的视图标记为脏：动画、滚动容器等。主机将每个图层光栅化一次到由其内容的哈希键控的屏幕外画布上，然后在后面的帧上进行合成。所有这一切意味着 Dactyl 可以直接在浏览器中流畅高效地渲染复杂的 SwiftUI 布局，无需任何安装步骤或额外设备。 （但它也可以处理所有这些。） 动态链接 Swift SwiftWasm 静态链接。这对我们来说并不理想，因为引擎约为 100 MB，而静态链接意味着每次编辑时都会链接并传送数百兆字节到浏览器。应用程序本身要小得多，因此我们拆分了构建。引擎和标准库作为基本模块链接一次，内容寻址，因此浏览器一次获取并编译它，并在编辑过程中保留它。您的应用程序将作为位置无关的侧模块自行编译，大小为 8 KB 到 300 KB。加载时，它被放置在运行时内存偏移处，其导入绑定到基础的导出，并且其 Swift 类型元数据注册到基础的运行时。交换发生在正在运行的应用程序下。 @State 在之前进行快照并在之后恢复，因此滚动位置、文本字段和应用程序数据在编辑过程中得以保留。 example/weather/ContentView.swift 89 Color ( red : 0.42 , green : 0.69 , blue : 0.95 )], 36 KB 0.28 s Android: Jetpack Compose 在 Android 上，引擎使用 Swift Android SDK 将 aarch64-unknown-linux-android24 本地编译为共享库。 Jetpack Compose 主机加载它并通过 JNI 驱动它。命令流直接从本机内存中读取，没有复制，因此 Compose 主机解码与浏览器相同的字节。当浏览器主机将控件绘制到画布上时，Compose 主机在该矩形上安装真正的材质开关、文本字段或日期选择器，并具有本机焦点、波纹、键盘和可访问性。下面的两部手机都运行相同的 71 行 SwiftUI 源代码：左边是启动的 iPhone 模拟器；右边是Android模拟器上的APK。 PICKER 分段 UIKit 分段控件与 Material 分段按钮，选中标记 SF 符号和 Material 符号是具有不同名称的不同图标集，因此生成的映射表涵盖两个主机。 Compose 的密度取决于引擎的布局比例而不是设备的布局比例，因此控件恰好落在引擎解析的矩形上。每个应用程序 APK 不会重建主机。共享库、应用程序名称和图标被标记到预构建的模板中。 iPad 是相同的引擎，但设备描述符不同。视口、安全区域和尺寸类别发生变化，SwiftUI 的自适应布局会完成剩下的工作。开发循环 苹果模拟器 我们的引擎差异时代