资讯专栏INFORMATION COLUMN

Flutter For Web

microelec / 2716人阅读

摘要:在端的雄心自从去年第一个公测版本推出之后,开发者使用构建跨和的应用。我们已经推出一个预览版,所以开发者可以进行尝鲜并给我们反馈。这个预览版的核心库是现有核心库的一个临时分支。将开发所需要的工具集成到现有的脚手架和编辑器中。

原文地址: https://medium.com/flutter/br...

原文作者: Kevin Moore

翻译作者: Fedora

Flutter For Web

用来构建漂亮、定制化应用的跨平台的 UI 框架 Flutter 现在已经支持 Web 开发了。我们很高兴推出了一个预览版的 SDK 可以让开发者直接使用 Flutter UI 和业务逻辑代码构建 web 应用在浏览器中运行起来。

Flutter 在 Web端的雄心

自从去年第一个公测版本推出之后,开发者使用 Flutter 构建跨 IOS 和 Android 的应用。但是 Flutter 自始至终被设计成一个跨平台的 UI 框架包括 Windows ,Mac,Fuchsia 甚至是 Raspberry Pi(树莓派)。因为 Flutter 是由 Dart 编写的,里面包含一个生产环境的编译器来构建原生的代码和 JavaScript 代码,所以我们有一个坚实的基础。剩下的挑战就是替换基于 Skia-based 的图形引擎和文本渲染来适配 Web 平台。

要做到这些,我们需要提供:

快速,无抖动的且每秒60帧的页面交互

考虑到 Flutter 在其他平台提供的能力和视觉

和现有开发模式整合的高效率的开发体验

支持所有现代浏览器的核心 Web 功能

虽然Flutter for web是一项正在进行中的工作,而且为了实现上述功能还有很多工作要做。我们已经推出一个预览版,所以开发者可以进行尝鲜并给我们反馈。

Flutter Web 架构

Flutter 在 Web 端的整体架构和移动端的架构差不多:

Flutter 核心层(上图绿色部分)在移动端和 Web 端是一样的。它提供了 Flutter UI 的高度抽象,包括动画,手势,基本的小部件,以及一套大部分应用需要的 Material 风格的部件。如果你已经在客户端开发中使用了 Flutter,那么你就会很快的在 Web 开发中上手。

神奇之处就是将这些概念(客户端层面的)编译到浏览器中。我们重新实现了 dart ui 库,原本是基于 Skia 引擎被用在客户端上,现在是基于 DOM 和 Canvas API。当你编译 Flutter 代码到 Web 端,你的应用包括 Flutter 核心库,Web 端的 dart ui 库,所有的用 Dart 语言写的代码都会被编译成 JavaScript 代码,能够运行在所有的现代化浏览器中。

我们正在认真考虑采纳 Web 核心的特性,像用 Flutter 的路由模型无缝衔接浏览器的 History 路由。我们还在与 Flutter 桌面终端 合作,来实现鼠标滚动,悬停和聚焦这些客户端开发中用不到的功能。

Flutter Web 项目聚焦的核心功能就是框架提供的丰富流畅的交互体验。基于 document 的 Web 端也能从 Flutter web 可视化中 收益。

这个预览版的核心库是现有 Flutter 核心库的一个临时分支。这让我们的工程师能够很快的实现 web 端功能而核心团队能够持续保持开发稳定的用于生产环境的工具。我们已经开始往主仓库合并部分支持浏览器端的代码。我们计划提供一个 Flutter 的工具包,里面的核心框架将为移动端,web,和其他平台提供支持。

我们计划的工作包括:

支持文本特性例如选中,复制和粘贴。

提供插件支持。像位置信息,摄像头,文件 API,我们希望提供一个简单的 API 将客户端和 web 端桥接起来。

对 PWA 提供开箱即用的技术支持。

将 web 开发所需要的工具集成到现有的 FLutter 脚手架和编辑器中。

能够用 DevTools 来调试 web 开发。

提高性能,浏览器支持以及无障碍的访问的能力

欢迎大家去 flutter.dev/web 查看例子,文档以及更多的资源。我们很期待你使用 Flutter 开发的 web 应用。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/105219.html

相关文章

  • Flutter For Web

    摘要:在端的雄心自从去年第一个公测版本推出之后,开发者使用构建跨和的应用。我们已经推出一个预览版,所以开发者可以进行尝鲜并给我们反馈。这个预览版的核心库是现有核心库的一个临时分支。将开发所需要的工具集成到现有的脚手架和编辑器中。 原文地址: https://medium.com/flutter/br...原文作者: Kevin Moore 翻译作者: Fedora Flutter For ...

    william 评论0 收藏0
  • Flutter 1.5 发布,正式成为全平台 UI 框架!

    摘要:一序在上,团队宣布推出新的稳定版本,这是迄今为止最大的一次版本发布。伴随着的发布,同期也宣布发布的版本,正式开启了的全平台框架之路。随着的发布,正式成为一个全平台的框架。开发流程目前仅支持。 showImg(https://segmentfault.com/img/remote/1460000019122961?w=640&h=100); showImg(https://segment...

    zsy888 评论0 收藏0
  • Flutter 1.5 发布,正式成为全平台 UI 框架!

    摘要:一序在上,团队宣布推出新的稳定版本,这是迄今为止最大的一次版本发布。伴随着的发布,同期也宣布发布的版本,正式开启了的全平台框架之路。随着的发布,正式成为一个全平台的框架。开发流程目前仅支持。showImg(https://user-gold-cdn.xitu.io/2019/5/9/16a9a8967e736208); showImg(https://user-gold-cdn.xitu.i...

    focusj 评论0 收藏0
  • Flutter 1(1),kotlin数组排序

    摘要:伴随着的发布,同期也宣布发布的版本,正式开启了的全平台框架之路。二之所以能够在移动平台上运行,主要是依赖的,就是所依赖的运行环境。随着的发布,正式成为一个全平台的框架。开发流程目前仅支持。 伴随着 Flutter 1.5 的发布,同期也宣布发布 Flutter for Web 的 Preview 版本,正式开启...

    不知名网友 评论0 收藏0
  • 让前端开发者失业的技术,Flutter Web初体验

    摘要:掌握可能是前端开发者翻盘的唯一机会。是开发必须的代码库。区别与应用,我们导入的是库而非,这是因为目前的接口并非和的完全通用,不过随着谷歌开发的继续,它们最终会被合并到一块。 Flutter是一种新型的客户端技术。它的最终目标是替代包含几乎所有平台的开发:iOS,Android,Web,桌面;做到了一次编写,多处运行。掌握Flutter web可能是Web前端开发者翻盘的唯一机会。 show...

    shiguibiao 评论0 收藏0

发表评论

0条评论

microelec

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<