Flutter 是 Google推出并开源的移动应用开发框架，主打跨平台、高保真、高性能。开发者可以通过 Dart语言开发 App，一套代码同时可运行在iOS, Android, Windows, macOS 和 Linux平台；以及Chrome, Firefox, Safari 和 Edge 等浏览器。

flutter特点

跨平台自绘引擎

  • 使用Skia(Google Chrome浏览器和Android的绘图引擎)作为其2D渲染引擎。

    高性能

    使用dart语言开发

  • 开发效率高
    Dart运行时和编译器支持Flutter的两个关键特性的组合：
    基于JIT的快速开发周期：Flutter在开发阶段采用，采用JIT(即时编译模式，静态编译方式)，这样就避免了每次改动都要进行编译，极大的节省了开发时间；
    基于AOT的发布包: Flutter在发布时可以通过AOT(提前编译模式，动态解释方式)生成高效的ARM代码以保证应用性能。而JavaScript则不具有这个能力。

  • 高性能
    Flutter旨在提供流畅、高保真的的UI体验。为了实现这一点，Flutter中需要能够在每个动画帧中运行大量的代码。这意味着需要一种既能提供高性能的语言，而不会出现会丢帧的周期性暂停，而Dart支持AOT，在这一点上可以做的比JavaScript更好。
  • 快速内存分配
    Flutter框架使用函数式流，这使得它在很大程度上依赖于底层的内存分配器。因此，拥有一个能够有效地处理琐碎任务的内存分配器将显得十分重要，在缺乏此功能的语言中，Flutter将无法有效地工作。当然Chrome V8的JavaScript引擎在内存分配上也已经做的很好，事实上Dart开发团队的很多成员都是来自Chrome团队的，所以在内存分配上Dart并不能作为超越JavaScript的优势，而对于Flutter来说，它需要这样的特性，而Dart也正好满足而已。
  • 类型安全
    由于Dart是类型安全的语言，支持静态类型检测，所以可以在编译前发现一些类型的错误，并排除潜在问题，这一点对于前端开发者来说可能会更具有吸引力。与之不同的，JavaScript是一个弱类型语言，也因此前端社区出现了很多给JavaScript代码添加静态类型检测的扩展语言和工具，如：微软的TypeScript以及Facebook的Flow。相比之下，Dart本身就支持静态类型，这是它的一个重要优势。
  • dart团队支持

Flutter框架结构

  1. Material(Android风格)、Cupertino (iOS风格) 组件库
  2. 基础组件库
  3. 抽象布局层
  4. dart ui层
  5. 纯c++实现的flutter引擎

    AD8D4F63-A933-45D9-8540-1E13CC3E486C.png

    常用脚本
    使用flutter web
    1. flutter channel master
    2. flutter upgrade
    3. flutter config --enable-web
    4. cd <into project directory>
    5. flutter create .
    6. flutter run -d chrome

运行打包

  1. // with skia
  3. flutter run -d Chrome --dart-define=FLUTTER_WEB_USE_SKIA=true --release
  5. // with canvas kit
  7. flutter run -d Chrome --dart-define=FLUTTER_WEB_CANVASKIT_URL=true --release
  9. flutter run -d Chrome --dart-define=FLUTTER_WEB_CANVASKIT_FORCE_CPU_ONLY=true --release
  11. // build/run web in canvaskit mode
  12. flutter build web --web-renderer canvaskit
  14. flutter run -d chrome --web-renderer canvaskit

flutter学习

利用好flutter的资源跟社区

多阅读

多实践

  • 搭建环境：使用IDE、了解目录结构、资源&包管理；
  • 启动调试打包：了解Dart DevTools、路由管理、动画；
  • 熟悉组件: app结构组件、基础组件、布局组件、滚动组件、容器类组件、功能型组件；
  • 熟悉数据机制：状态管理、事件处理与通知、数据缓存；
  • 熟悉dart语言特性


多思考