Flutter 的 Web 支持

Flutter 在 Web 上提供与移动设备上相同的体验。

基于 Dart 的可移植性、Web 平台的强大功能、Flutter 框架的灵活性以及 WebAssembly 的性能，您可以从同一个代码库构建适用于 iOS、Android 和浏览器的应用。Web 只是您的应用的另一个设备目标。

要开始使用，请访问 使用 Flutter 构建 Web 应用。

Dart 和 Flutter 可以编译为 WebAssembly，这是一种二进制指令格式，可以在所有主流浏览器上启用快速应用。

要了解使用 WebAssembly 的优势，请查看以下视频。

Flutter 中的新增功能 - WebAssembly

向 Flutter 添加 Web 支持涉及在标准浏览器 API 之上实现 Flutter 的核心绘图层，此外还将 Dart 编译为 JavaScript，而不是移动应用使用的 ARM 机器代码。通过结合使用 DOM、Canvas 和 WebAssembly，Flutter 可以在现代浏览器中提供可移植、高质量且高性能的用户体验。我们完全在 Dart 中实现了核心绘图层，并使用 Dart 优化的 JavaScript 编译器将 Flutter 核心和框架以及您的应用编译成单个最小化的源文件，该文件可以部署到任何 Web 服务器。

虽然您可以在 Web 上做很多事情，但 Flutter 的 Web 支持在以下场景中最有价值

单页应用

Flutter 的 Web 支持使功能丰富的复杂独立 Web 应用能够触达各种设备上的最终用户。

现有移动应用

Flutter 的 Web 支持为现有的 Flutter 移动应用提供了一种基于浏览器的交付模型。

目前并非所有 HTML 场景都非常适合使用 Flutter。例如，富文本、基于流的静态内容（如博文）受益于 Web 构建的文档中心模型，而不是像 Flutter 这样的 UI 框架可以提供的应用中心服务。但是，您可以使用 Flutter 将交互式体验嵌入到这些网站中。

以下资源可以帮助您入门

• 要向现有应用添加 Web 支持，或创建包含 Web 支持的新应用，请参阅 使用 Flutter 构建 Web 应用。
• 要了解 Flutter 的不同 Web 渲染器（HTML 和 CanvasKit），请参阅 Web 渲染器
• 要了解如何创建响应式 Flutter 应用，请参阅 创建响应式应用。
• 要查看常见问题解答，请参阅 Web 常见问题解答。
• 要查看代码示例，请查看 Flutter 的 Web 示例。
• 要查看 Flutter Web 应用演示，请查看 Wonderous 应用。
• 要了解如何部署 Web 应用，请参阅 准备 Web 应用发布。
• 在主 Flutter 仓库中提交问题。
• 您可以在 Discord 上的 #help 频道中聊天并提出与 Web 相关的问题。

除非另有说明，否则本网站上的文档反映了 Flutter 的最新稳定版本。页面最后更新时间：2024-11-20。 查看源代码 或 报告问题.