目标全平台的Flutter支持Web应用开发了!

简介: Flutter作为一个可移植的UI框架,已经支持现代Web应用开发了!我们很开心已经发布了SDK预览版,这样你可以在Web浏览器里直接运行你的Flutter UI代码。 原文链接:Flutter Web - 目标全平台开发的Flutter再下一城!- 汇智网 Flutter Web的目标 从去年Beta版发布以来,客户们已经使用Flutter来创建可以运行在iOS和Android上的移动应用了。
+关注继续查看

Flutter作为一个可移植的UI框架,已经支持现代Web应用开发了!我们很开心已经发布了SDK预览版,这样你可以在Web浏览器里直接运行你的Flutter UI代码。

原文链接:Flutter Web - 目标全平台开发的Flutter再下一城!- 汇智网

Flutter Web的目标

从去年Beta版发布以来,客户们已经使用Flutter来创建可以运行在iOS和Android上的移动应用了。但是,Flutter是以可移植的UI工具集构架的,它还可以运行在其他环境下,例如Windows、Mac、Fuchsia甚至Raspberry Pi。 由于Flutter是使用Dart构建的,它针对原生机器码和JavaScript都包含了生产级的编译器,因此我们有了一个坚实的基础。接下来的挑战在于需要使用web平台的对等单元来替换基于Skia的图形引擎和文本渲染器。

要正确地实现这一点,我们需要提供:

  • 60帧/秒快速平滑动画的性能
  • 与其他平台一致的行为和视觉感受
  • 可以与当前开发模式集成的高效的开发者工具
  • 在所有现代浏览器上对核心web特性的支持

虽然用于Web的Flutter还在开发中,在上述几个方面都还有很多工作要进行,不过我们已经可以和大家分享一个预览版了,你可以尝试以下,期待你的反馈!

Flutter Web总体架构

Flutter Web的总体架构与用于移动平台的Flutter非常接近:

flutter web architecture

Flutter框架(上图中绿色部分)在移动和web平台中共享,它提供了Flutter的UI基础层的高层次抽象,包括动画、收拾、基础组件类、以及大多数应用需要的物化主题的组件集。如果你已经在Flutter上开发,那么使用Flutter Web时你会感到非常熟悉。

魔力来自于将这些概念翻译到浏览器平台。我们重新实现了dart:ui库,使用基于DOM和Canvas的代码替换了移动平台上对Skia引擎的绑定。当你为Web平台编译Flutter代码时,你的应用、Flutter框架、以及Web版本的dart:ui库都将编译为JavaScript,可以运行在任何现代浏览器上。

flutter web architecture

我们仔细地拥抱web核心特性,例如将Flutter的路由模型与浏览器History无缝集成。我们同时也努力让Flutter适应桌面环境,例如启用鼠标滚动、悬停、聚焦等等,虽然这些特性在移动体验中并不需要。

Flutter Web项目聚焦于框架提供的核心价值:丰富的交互式体验。而聚焦于文档的Web内容依然可以通过嵌入Flutter Web可视化元素来获益。

预览版本的Flutter Web框架当前是作为已有Flutter框架的一个临时分支。这使得我们的工程师可以快速实现Web功能,同时核心团队可以继续维护并改进生产可用的工具集。我们一进刚开始将浏览器支持合并到主仓库。我们计划提供一个Flutter工具集,提供一个单一的框架来满足移动、Web以及其他平台的开发需要。

接下来计划的工作包括:

  • 支持文本相关的特性,例如选中、复制、粘贴
  • 支持插件。对于像位置、摄像头、文件访问这些特性,我们希望使用单一API来桥接移动平台和Web
  • 为PWA这样的科技提供开箱即用的支持
  • 使用已有的Flutter命令行和IDE集成工具来统一web开发工具链
  • 使用DevTools调试web应用
  • 性能的改善、浏览器的支持,以及可访问性

你可以到flutter.dev/web查看示例、文档以及其他资源的链接,我们期待着看到你的创作!

目录
相关文章
|
4月前
|
数据安全/隐私保护
带你读《商用密码技术最佳实践白皮书》——Web服务国密双证书支持(1)
带你读《商用密码技术最佳实践白皮书》——Web服务国密双证书支持(1)
|
10月前
|
前端开发 容器
web应用开发线上联系(题解)
1.改一下css文件,index引用的css文件名不对;
71 0
web应用开发线上联系(题解)
|
JSON 前端开发 Serverless
Serverless 时代,这才是 Web 应用开发正确的打开方式
如同 iPhone 当年颠覆了诺基亚,Serverless 的出现也带来了一种全新的、颠覆式的云开发架构模式。
145 0
Serverless 时代,这才是 Web 应用开发正确的打开方式
|
Web App开发 JavaScript 前端开发
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
|
Web App开发 JavaScript 前端开发
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
125 0
web 应用开发最佳实践之一:避免大型、复杂的布局和布局抖动
|
监控 Cloud Native 安全
基于阿里云打造『云原生』Web应用——『懒猪行』Web应用开发实践
『懒猪行』专注于境外自由行S2B业务,涉及分销、终端用户服务、供应链等多个服务环节,随着业务规模的不端增加,我们一直在探索Web应用开发的最佳实践,以加快Web应用的迭代效率,为B/C端用户创造更多价值。
3287 0
|
Java 数据库 容器
基于SSM的Java Web应用开发原理初探
SSM开发Web的框架已经很成熟了,成熟得以至于有点落后了。虽然如今是SOA架构大行其道,微服务铺天盖地的时代,不过因为仍有大量的企业开发依赖于SSM,本文简单对基于SSM的Java开发做一快速入门,方便读者尽快把握脉络,理解Java Web开发的主轴,便于做进一步深入学习。
1385 0
|
Web App开发 前端开发 Java
spring boot 2.0之web应用开发
web应用开发 简介 spring boot 非常适合进行web程序开发。可以通过使用spring-boot-starter-web快速创建一个内嵌tomcat或Jetty,或netty的应用。
8855 0
相关产品
云迁移中心
推荐文章
更多