Dactyl 的工作原理
Divy Srivastava · 2026年8月26日 对于大语言模型(LLMs)来说,应用程序开发始终比网络开发要困难。应用程序往往具有平台特定的样式规范和布局,并且需要看起来和感觉上一致。人们可以感受到一个应用程序是否“原生”,是否为他们的设备量身定制。此外,网络是开放和通用的,而应用程序和应用商店通常并非如此,这意味着 LLMs 在训练集中的数据相对较少。许多基于氛围编码的平台试图通过本质上妥协来解决这个问题。它们使用 Expo/React Native、Flutter,甚至仅仅是 Webview 来生成应用程序。但是我们发现,这些方法没有提供最佳的用户体验;总是在牺牲某些东西,无论是跨平台兼容性、原生组件、性能还是功能。我们创建 Dactyl 来帮助您构建没有这些妥协的原生应用程序。今天,我们介绍 Dactyl 的跨平台 SwiftUI 渲染器的内部工作原理——一个 iOS 模拟器的 Wasm 移植版——以及我们如何将苹果生态系统带到安卓和网络。 网络上的 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,而不是苹果的。引擎将绘制命令的二进制流发射到其自己的线性内存中,协议由一个 JavaScript 主机读取,并在 Canvas2D 上绘制。所有命令写入之前布局完全解决,统一器在不同的循环之间保持视图树,仅标记在此帧中读取了某些内容的视图:动画、滚动容器等。宿主程序将每一层一次光栅化到一个由内容哈希键控的离屏画布中,然后在后续帧上合成。所有这一切意味着 Dactyl 可以在浏览器中流畅高效地直接渲染复杂的 SwiftUI 布局,而无需任何安装步骤或额外设备。(但它也可以处理所有这些。) 布局树加载...解决的帧 动态链接 Swift SwiftWasm 静态链接。这对我们来说并不理想,因为引擎约 100 MB,而静态链接意味着在每次编辑时都需要链接和发送数百兆字节到浏览器。应用程序本身小得多,因此我们拆分构建。引擎和标准库一次作为基础模块链接,内容地址化,因此浏览器只需一次获取和编译,并在编辑之间保留它。您的应用程序作为位置无关的边模块独立编译,大小为 8 KB 到 300 KB。加载时,它被置于运行时内存偏移量,其导入绑定到基础的导出,其 Swift 类型元数据与基础运行时注册。交换发生在运行中的应用程序下。@State 在前后快照,并恢复,因此滚动位置、文本框和应用程序数据在编辑之间得以保留。 示例/weather/ContentView.swift 89 Color ( red : 0.42 , green : 0.69 , blue : 0.95 )], 36 KB 0.28 s 安卓:Jetpack Compose 在 Android 上,引擎为 aarch64-unknown-linux-android24 使用 Swift Android SDK 编译为共享库。Jetpack Compose 主机加载它并通过 JNI 驱动它。命令流直接从本机内存读取,无需复制,因此 Compose 主机解码与浏览器相同的字节。浏览器主机将在画布上绘制控件,Compose 主机会在该矩形上安装真实的 Material 开关、文本框或日期选择器,具有原生焦点、涟漪、键盘和无障碍功能。以下两个手机运行相同的 71 行 SwiftUI 源代码:左边是启动的 iPhone 模拟器;右边是 Android 模拟器上的 APK。 iOS Android 选择器 分段的 UIKit 分段控件与 Material 分段按钮,检查标记 SF 符号和 Material 符号是不同的图标集,具有不同的名称,因此一个生成的映射表覆盖两个主机。Compose 的密度固定在引擎的布局比例上,而不是设备上,因此控件正好落在引擎解决的矩形上。每个应用程序 APK 不重建主机。共享库、应用程序名称和图标被印刻在预构建的模板中。iPad 使用相同的引擎,但具有不同的设备描述符。视口、安全区域和尺寸类发生变化,SwiftUI 的自适应布局完成其余的工作。 开发循环
本站免费、广告极少。如果觉得有帮助,可以请我们喝杯咖啡 —— 任何金额都对持续运营有实际帮助。
☕请我喝杯咖啡