共计 2620 个字符，预计需要花费 7 分钟才能阅读完成。
背景
Flutter 是什么
跨端开发历程：Hybrid（Webview + js）=> OEM Widgets（RN、Weex）=> 自渲染（Flutter）
Flutter 是 Google 开源的 UI 工具包，帮忙开发者通过一套代码库高效构建多平台精美利用
野心：Mobile、Web（已反对 beta 频道）、Desktop、Embedded
概览
- Flutter 框架总览
- 2D 渲染引擎 Skia，原则上比 React Native 和 Weex 性能更好
RN 框架原理图
Flutter 框架原理图
- Dart && Widgets
- Material && Cupertino
其余
自己之前次要从事 Web 端开发，对客户端开发的流程还不太理解
- 操作系统：Windows 10
- IDE：Android Studio 3.5
- 编辑器：VS Code
- Android SDK 版本：30.0.1
- Flutter 版本：1.21.0-2.0.pre.114
- Dart 版本：2.9.0
- 预留硬盘空间 10Gb 以上
必要时可能须要迷信上网，查看 官网文档 也倡议开启迷信上网，否则有些字体文件加载不了，左侧菜单栏会显示异样
装置踩坑
- 为 Flutter 设定镜像配置
- 装置 Flutter SDK，我是通过 命令行形式 装置的
- 配置 Flutter 环境变量，不同操作系统配置形式有所不同。配置实现后在终端命令行里运行
flutter --version查看是否配置胜利 - 装置 Android Studio，因为后续须要 IDE 帮助装置一些 SDK、SDK Tools 和 Plugins
- 通过 Android Studio IDE 装置 Android SDK 和一些 SDK Tools，还有 Flutter 和 Dart 插件，该过程耗时比拟长，次要是因为要下载一些很大的包（如果还要配置 AVD 虚构设施的话还要更多工夫）
- 罕用编辑器里配置 Flutter（我罕用 VS Code 做开发，扩大外面装置 Flutter 和 Dart 这两个插件，装置 Flutter 时会顺带举荐 Dart，如果装很久都装不上倡议迷信上网试试）
- 运行
flutter doctor没报错就示意所有得当，能够筹备新建我的项目了（提醒 No devices available 能够先不论，用 USB 连贯真机，开启 USB 调试模式就能够；或者后面如果有用 Android Studio IDE 配置虚构设施，前面调试时能够用虚构设施跑一下。有其余报错能够运行flutter doctor -v查看更具体的提示信息）
flutter doctor失常后，去到你要创立我的项目的目录里，执行flutter create 我的项目名新建我的项目- 执行
flutter run跑我的项目，如果始终卡在 Running Gradle task ‘assembleDebug’… 看这里（不过我貌似等一会就能够持续运行，没有改任何配置，而后手机上容许装置就能够调试 app 了）
初步体验
- 构建、测试和调试的集成体验较好，尤其是自带单元测试框架，仅需本人写测试用例就能够进行单元测试了
flutter test test/***.dart
- 热加载有时还是会生效
- widgets 的细粒度令我对部件和组件有了重新认识，日常 Web 开发多是 components 级别的组件开发，但 Flutter 外面是粒度更细的部件 widgets，甚至在 Web 开发中的一个款式也是一个 widget（有益处，但也会引出上面的问题）
- widgets 嵌套层级问题，Padding 是一个 widget，Center 也是一个 widget，当两者都须要时，就会两层嵌套，所以代码经常看起来是多层嵌套的调用（有想过封装会不会代码层面上看得舒服点，但官网又举荐 组合大于继承）
- Flutter for Web 是基于 Canvas 上绘制，貌似对 SEO 不太敌对
- Flutter 初始化最简略的一个官网示例，打包成 apk 都要 40 多秒，平时用 Vue 初始化的示例，打包仅须要 10 几秒
- 社区活跃度有待欠缺（很多第三方库还没工夫理解，但联合公司我的项目来看，如果是数据可视化图表的库，很多是散装的，没有 echarts 那样集成欠缺，比方可能绘制条形图、词云、雷达图要别离引 3 个库；但 官网 pub 库 中每个第三方库都会有个 pub 评分，比拟好奇它这个规范的参考意义）
- 须要学 Dart 语言（这里介绍了一些 dart 和 js 的区别）和理解客户端的开发流程，开发调试要进行多端测试（举荐用苹果零碎开发，Linux 和 Windows 上模仿 iPhone 更麻烦，都要基于虚拟机跑 Xcode。当然土豪最好还是真机调试）
- 对开发人员和开发配套环境要求更高，通常 IOS 端开发会日常应用 iPhone，Android 开发人员会日常应用安卓手机，但要求既带 iPhone 又带安卓手机这样的人貌似更难招
基于实际工夫无限，一些纳闷和尚未实际的：
- 开发时使用假数据
- 一些更高级应用场景的单元测试
- 各种性能调优
- Flutter for Web 暂未深刻实际，零碎级别的操作是否都反对得很欠缺（比方读取相册抉择图片上传，调用摄像头等）
总结
什么时候思考用 Flutter？
- 心愿产品设计格调在各平台统一
- 简略的功能性 APP（音视频解码播放转换等还是原生能力做，像做游戏这种级别的也不太适宜，不过实现可能性上来说还是比 React Native 和 Weex 更高）
- 产品初期心愿疾速在各端同步迭代
Flutter 不是为了代替原生，而且苹果也不可能轻易就让 Google 鲸吞本人的生态，跨端和原生还是会共存互补很长一段时间。咱们用 Flutter 更应该是聚焦于一套代码保护各端开发的便当是否始终实用，援用别处看到的一段话：
跨平台的市场劣势不在于性能或学习老本，甚至平台适配会更消耗工夫，然而它最终能让代码逻辑（特地是业务逻辑），无缝的复用在各个平台上，升高了反复代码的保护老本，保障了各平台间的统一性，如果这时候还能保障肯定的性能，那就更完满了
一些资源
Flutter 官网中文文档：https://flutter.cn/docs
Dart 官网文档：https://dart.cn/guides
官网 packages：https://pub.flutter-io.cn/
闲鱼团队：https://www.yuque.com/xytech/…
GSY Flutter 系列掘金专栏：https://juejin.im/collection/…
Flutter 官网的一些示例：https://flutter.github.io/sam…
帮忙开发者疾速上手的 app：https://github.com/alibaba/fl…
