Flutter 正式支持 Web 平台

Flutter 的 Web 端支持在 Web 和移动设备上提供相同的体验。

基于 Dart 的可移植性、Web 平台的强大、Flutter 框架的灵活性,以及 WebAssembly 的高性能,你可以通过同一套代码为 iOS、Android 和浏览器构建应用。对于你的应用来说,Web 只是另一个目标设备。

请访问 构建 Flutter Web 应用,开始学习。

WebAssembly 支持

#

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

请观看以下视频,来了解使用 WebAssembly 的好处。


What's new in Flutter - WebAssembly

工作原理

#

向 Flutter 添加 Web 支持的过程,涉及在标准浏览器 API 之上实现 Flutter 的核心绘图层,并将 Dart 编译为 JavaScript,而非移动端应用所使用的 ARM 机器码。通过结合使用 DOM、Canvas 和 WebAssembly, Flutter 能够在现代浏览器中提供便携、高质量且高性能的用户体验。我们完全使用 Dart 实现了核心绘图层,并利用 Dart 优化过的 JavaScript 编译器,将 Flutter 的核心、框架以及你的应用编译为一个单一且简化的源文件。可以部署到任何 Web 服务器上。

Flutter architecture for web

我能构建哪种类型的应用?

#

尽管你可以在 Web 上做很多事情,但 Flutter 的 Web 在以下场景最具价值:

单页应用
Flutter Web 可让功能复杂的独立 Web 应用在各种设备上向终端用户提供富含图形以及交互式的内容。

现有的移动端应用
Flutter Web 可以为现有的 Flutter 移动端应用提供基于浏览器的运行方式。

目前,并非所有 HTML 场景都适合 Flutter。例如,像博客文章这样的富文本、流式布局、静态内容,更适合 Web 本身基于结构化文档内容 (document-centric) 的运行方式,而非像 Flutter 这样的 UI 框架所提供的专注于应用交互界面服务 (app-centric) 的运行方式,不过,你仍然 可以 使用 Flutter 将交互式体验嵌入到这些网站中。

开始使用

#

以下资源可以帮助你入门: