Flutter Web Beta版本终于发布了，可用于实际开发了

小伙伴们，好消息来了，在12月12号的Flutter Interact2019会议上，谷歌Flutter团队带来了最新的Flutter1.12版本，在此次版本更新中，其中一个最吸引人的功能就是——“Flutter Web Beta”，没错，Flutter Web终于有beta版本了，也就说说你可以用它开发实际Web项目了，激不激动？刺不刺激？另外谷歌针对Web的一些插件库做了更新升级，常用的功能编写完全不用担心了。

PS：12月12日凌晨，作为一个剁手的日子，我怎么跑来学习了？我不是应该买买买吗？哦，我忘了，我太穷了，只能多努力学习提升自己了，哪像各位大佬这时候还露着对象捂被子呢？o(╥﹏╥)o 闲话少说，直接进入今天的正题：

---

一、有了FlutterNative，为什么还要用Flutter Web？

因为开发人员构建的应用程序需要同时在移动设备和Web上运行，并且能够完美地运行起来。作为开发人员，需要学习一组可以轻松跨多个平台迁移的技能是非常有必要的。Flutter支持Web，意味着开发人员可以使用相同的代码，更快地发布功能，并确保其跨设备（Android、iOS、Web）体验的一致性。此外，功能强大的Dart编译器针对Web专门做了优化升级，然后Flutter架构是可移植的，这些就让开发者使用Flutter能够轻易的创建出具有非常良好的性能的，交互式强的，多端一致性的Web体验的程序。

我们看看Flutter Web的兼容性，简直是太酷了！不管是手机、平板还是手机浏览器、桌面浏览器都可以得到很好地兼容，完美！打分82分，剩下的是666！

---

二、Fluttwe Web支持的方案选型

Flutter团队给出的适合Flutter Web特征的场景有以下这些：

1.联网的独立应用程序

Flutter可使开发人员在移动端和浏览器中使用相同的代码构建单个应用程序。这是Flutter Web的一个最初期开始就制定的一个方案，也是用的最广泛的一种跨平台方案。这样一来充分你用了Flutter的跨平台的能力，真正做到了一次代码，三端运行，并且具有一致性和高性能的特点，维护起来也很方便。（希望不要被那些黑心的老板或者喜欢压榨的技术管理看到，要不然程序员又要苦逼了。。。一个人干3个人的活。。就问你爽不爽？）

2.嵌入式互动内容

一种情况是在父站点中嵌入功能丰富的，以数据为中心的mini应用程序，并且无需导航服务或其他类似应用的功能。比如：你可以嵌入一个数字游戏，在线聊天机器人，房贷计算器，天气预报等。

3.精简版应用

精简版Web应用程序可以使用Flutter相同的工具，框架，UI组件和业务逻辑来提供较少的功能丰富的体验以及相关功能。然后就可以减少部分开发者因为安装问题出现的难题而错过了Flutter的使用。现有的Flutter应用程序具有轻量级的Web体验，可为公司带来两全其美的体验。

4.伴侣应用

Flutter Web是辅助，移动端应用程序是主体，使用Flutter构建的网络体验，然后用于支持你的移动应用程序。比如使用Flutter构建一个Web应用程序，使管理员或内部用户可以为现有的Flutter移动应用程序创建内容或管理后端。尽管有点麻烦，但是Flutter Web这一部分可以利用移动应用程序中的许多相同代码。

---

三、丰富的Web插件支持

Flutter团队也针对Web的插件做了大量改进和完善，另外 pub.dev 网站也做了更新升级，新增平台标记和过滤。

在搜索页面做了优化，列出了软件包支持Dart还是Flutter，点击Dart进去，就会看到右侧有两个细分类：Native、JS；点击Flutter进去，就会看到右侧有三个细分类：Android、iOS、Web。如果点击Any就会显示所有的插件库。

Flutter团队针对Web对一些包进行了升级，Flutter团队已经帮我们把Flutter和JS相互调用的功能封装好了，直接调用这些包里面的API就可以了，这些包可以在Flutter和Flutter Web上同时运行，所以不必担心兼容性问题，开发起来还是很快捷方便的。包括以下这些：

• shared_preferences： Flutter插件，用于读写简单的键值对。
• firebase_core 可连接到多个Firebase应用程序
• firebase_auth 用于Firebase身份验证的Flutter插件
• google_sign_in 谷歌登录
• url_launcher 路由导航
• video_player 视频播放
• sentry Dart的崩溃报告库

【PS】：我在3个月前Flutter1.9版本刚出来时的Flutter Web体验时，就对url_launcher不支持Web功能给Flutter提了一个issues，没想到这么快就实现了，不得不佩服谷歌Flutter团队的办事效率。当然目前来看Flutter Web插件还不够多，也希望各位大佬都踊跃参加，积极贡献自己写的插件，让Flutter Web更完善。

---

四、待完善的问题

虽然Flutter Web beta版本已经发布，但是里面还是有很多工作需要处理的，主要有以下三个方面：

1.辅助功能

目前已为跨平台的辅助技术实现的一些功能包括诸如UI遍历和遍历顺序，UI交互提示（如可轻击，文本标签，可编辑的文本，增量，图片，活动区域和单选框）之类的功能。桌面Web浏览器添加屏幕阅读器的支持功能正在研发中。

2.多浏览器支持

随着Flutter从仅移动的框架发展到涵盖桌面UX习惯用法，Flutter对桌面Web浏览器的支持将得到改善，并变得更加无缝。Flutter Web团队计划在桌面Web浏览器和移动浏览器上支持和测试Chrome，Edge，Firefox和Safari。

3.测试范围

Flutter Web的发布以来，Flutter Web团队在框架和Flutter Web引擎上的测试范围在逐渐增加。Flutter Web团队已经在Chrome上运行自动化测试，并手动测试Safari。未来还有更多的测试工作要做。

---

本文首发在公众号【Flutter那些事】，未经授权，严禁转载。欢迎大家关注公众号【Flutter那些事】，更多干货等你来看。