Flutter 95: 图解 Dart 单线程实现异步处理之 Task Queue

简介: 0 基础学习 Flutter,第九十五节:学习一下 MicroTask 和 EventTask 任务调度!

      小菜前段时间简单研究了一下 Dart 单线程实现异步的操作,今天继续学习 Dart 的事件机制的任务调度;

任务调度

      Dart 是单线程的,一个 Flutter 程序由一个或多个 isolate 组成,默认的执行方法均是在 main isolate 中;一个 isolate 中包含一个 Event Loop 和一个 Task Queue,而 Task Queue 包含 MicroTask Queue 微事件队列和 Event Queue 事件队列两种;

      Dart 的事件机制是根据任务调度优先级来实现的;其中将任务添加到 MicroTask Queue 微事件队列的方式有 scheduleMicrotask()Future.microtask() 两种;而将任务添加到 Event Queue 事件队列一般通过 Future 的相关构造方法实现;

      MicroTask Queue 微事件队列的执行优先级高于 Event Queue 事件队列,而小菜简单理解,两种均类似于 Android 线程中的异步操作,只是 MicroTask Queue 微事件队列优先级相对更高;

Dart 的事件执行顺序如图所示;

  1. 启动 app 后优先执行 main() 方法中的同步方法;
  2. 查看 MicroTask Queue 是否为空,若不为空,优先循环执行 MicroTask Queue 中的 MicroTask,直到队列为空;
  3. MicroTask Queue 队列为空则查看 Event Queue 事件队列,若不为空,则循环执行 Event Queue 中的 Event 事件,直到队列为空;
  4. 等两个队列的任务均执行完成后结束;

      Tips: 当任务队列执行 MicroTask Queue 微事件队列时,Event Queue 事件队列被卡住,即应用无法绘制图形,处理鼠标点击事件,无法对 I/O 事件做出反应等;

案例尝试

      每个 isolate 有各自的内存块和 Event Loop 是互相隔离的,小菜只尝试单个 isolate 中的微事件队列和事件队列的执行顺序;

  1. 小菜优先尝试最基本的 Future 构造函数和 MicroTask 的执行顺序;
_taskQueue01() {
  Future(() => print('TaskQueue -> Future A'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask B'));
  Future(() => print('TaskQueue -> Future C'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
}

      根据上述执行顺序,首先执行 main() 中同步的日志输出 Click start -> end,之后优先执行 MicroTask 微事件 scheduleMicrotask A -> C;再之后执行添加到 EventTask 事件队列的 Future() 构造函数 Future A -> C;最后执行因延迟 2s 加入事件队列的 Future B

  1. 小菜在【案例一】的基础上尝试添加 Future.microtask() 构造函数;
_taskQueue02() {
  Future(() => print('TaskQueue -> Future A'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'));
  Future.microtask(() => print('TaskQueue -> Future.microtask B'));
  Future(() => print('TaskQueue -> Future C'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
}

      简单了解 Future.microtask() 函数源码,其实就是封装了一个 scheduleMicrotask() 微事件,所以微事件队列执行顺序为 scheduleMicrotask A -> B -> C

  1. 小菜在【案例二】的基础上尝试添加 Future.sync() 构造函数;
_taskQueue03() {
  Future(() => print('TaskQueue -> Future A'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.sync(() => print('TaskQueue -> Future.sync D'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'));
  Future.microtask(() => print('TaskQueue -> Future.microtask B'));
  Future(() => print('TaskQueue -> Future C'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
}

      Future.sync() 为同步方法,会立即执行,因此是在 main() 点击同步日志 startend 之间的;

  1. 小菜尝试添加 Future.then() 级联方法;
_taskQueue04() {
  Future(() => print('TaskQueue -> Future A'))
      .then((_) => print('TaskQueue -> Future A -> then()01'))
      .then((_) => print('TaskQueue -> Future A -> then()02'));
  Future.sync(() => print('TaskQueue -> Future.sync D'))
      .then((_) => print('TaskQueue -> Future.sync D -> then()01'))
      .then((_) => print('TaskQueue -> Future.sync D -> then()02'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()01'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()02'));
  Future.microtask(() => print('TaskQueue -> Future.microtask B'))
      .then((_) => print('TaskQueue -> Future.microtask B -> then()01'))
      .then((_) => print('TaskQueue -> Future.microtask B -> then()02'));
  Future(() => print('TaskQueue -> Future C'))
      .then((_) => print('TaskQueue -> Future C -> then()01'))
      .then((_) => print('TaskQueue -> Future C -> then()02'));
}

      Future.then() 级联函数是按照顺序执行的,执行完第一个 then() 函数后才会执行第二个 then();且小菜理解为 then() 函数会在 Future() 执行之后立即执行,可以看作是存放在微事件队列中;因此整体的执行顺序是 sync()-> sync().then() -> microtask() -> microtask().then() -> Future() -> Future().then() -> delayed() -> delayed().then()

  1. 小菜在【案例三 + 四】的基础上添加 Future.whenComplete() 方法;
_taskQueue05() {
  Future(() => print('TaskQueue -> Future A'))
      .then((_) => print('TaskQueue -> Future A -> then()01'))
      .then((_) => print('TaskQueue -> Future A -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future A -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.sync(() => print('TaskQueue -> Future.sync D'))
      .then((_) => print('TaskQueue -> Future.sync D -> then()01'))
      .then((_) => print('TaskQueue -> Future.sync D -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future.sync D -> whenComplete()'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()01'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future.delayed B -> whenComplete()'));
  Future.microtask(() => print('TaskQueue -> Future.microtask B'))
      .then((_) => print('TaskQueue -> Future.microtask B -> then()01'))
      .then((_) => print('TaskQueue -> Future.microtask B -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future.microtask B -> whenComplete()'));
  Future(() => print('TaskQueue -> Future C'))
      .then((_) => print('TaskQueue -> Future C -> then()01'))
      .then((_) => print('TaskQueue -> Future C -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future C -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
}

      Future.whenComplete() 是在 Future()then() 函数执行完成之后立即执行;小菜也简单看作是存放在微事件队列中;依照小菜的测试案例来看,sync 执行同步任务完成后,会循环遍历微事件队列,其中 scheduleMicrotask A 是在 sync() 函数之前加入 MicroTask Queue 中,因此是先执行 scheduleMicrotask A 再执行 sync() 之后的 then()whenComplete() 方法;

  1. 小菜尝试在 then() 函数中执行新的事件队列;
_taskQueue06() {
  Future(() => print('TaskQueue -> Future A'))
      .then((_) {
        print('TaskQueue -> Future A -> then()01');
        return Future.delayed(Duration(seconds: 1), () => print('TaskQueue -> Future.delayed D'));
      })
      .then((_) => print('TaskQueue -> Future A -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future A -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()01'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future.delayed B -> whenComplete()'));
  Future(() => print('TaskQueue -> Future C'))
      .then((_) {
        print('TaskQueue -> Future C -> then()01');
        return scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
      })
      .then((_) => print('TaskQueue -> Future C -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future C -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask B'));
}

    a. 首先执行 MicroTask Queue 微事件队列中的 scheduleMicrotask A -> B
    b. 之后以 FIFO 先进先出的顺序执行 EventTask Queue 事件队列中 Task;先执行 Future A,之后是 Athen()01,此时小菜设置了一个 1s 的延迟 Future.delayed D,因为 then() 的级联函数是需要等前面的 then() 函数执行完成后才能执行;因此优先执行 EventTask Queue 中的 Future C
    c. 执行完 Future C 之后执行 then()01,此时小菜设置了一个 MicroTask,依照小菜的理解,then() / whenComplete() 均存放在 MicroTask Queue 中,因此新设置的 MicroTask 会放置在 MicroTask Queue 末尾,等 then()02whenComplete() 再执行;
    d. 此时 EventTask Queue 事件队列中已执行完毕,在 1s 后添加了新的 Future.delayed D 并执行;
    e. 待 Future.delayed D 执行结束或,Future A 的第二个级联 then() 函数和 whenComplete() 开始执行;
    f. 最后执行延迟最久的 2sFuture.delayed B 及其 then() / whenComplete() 函数;

  1. 小菜在测试过程中,与【案例六】代码几乎一致,只是在 Future.then() 中调用 Future() 时少了 return
_taskQueue07() {
  Future(() => print('TaskQueue -> Future A'))
      .then((_) {
        print('TaskQueue -> Future A -> then()01');
        Future.delayed(Duration(seconds: 1), () => print('TaskQueue -> Future.delayed D'));
      })
      .then((_) => print('TaskQueue -> Future A -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future A -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask A'));
  Future.delayed(Duration(seconds: 2), () => print('TaskQueue -> Future.delayed B'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()01'))
      .then((_) => print('TaskQueue -> Future.delayed B -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future.delayed B -> whenComplete()'));
  Future(() => print('TaskQueue -> Future C'))
      .then((_) {
        print('TaskQueue -> Future C -> then()01');
        scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask C'));
      })
      .then((_) => print('TaskQueue -> Future C -> then()02'))
      .whenComplete(() => print('TaskQueue -> Future C -> whenComplete()'));
  scheduleMicrotask(() => print('TaskQueue -> scheduleMicrotask B'));
}

      小菜测试发现,虽然只是少了两个 return 但是执行顺序却变化很大;
    a. 首先执行微事件队列中的 scheduleMicrotask A -> B
    b. 之后执行 EventTask Queue 中的 Future A,执行第一个 print(then()01) 之后,小菜设置了 Future.delayed D,因为无需返回,所以将 Future.delayed D 事件队列末位后第一个 then() 函数已完成执行,此时可以执行第二个 then()02whenComplete() 函数;
    c. 继续执行 EventTask Queue 中的 Future C,执行第一个 print(then()01) 之后,小菜设置了 scheduleMicrotask() C,无需 return,将 scheduleMicrotask() C 添加到微事件队列末位,此时第一个 then() 函数以完成执行,执行微事件队列中的第二个 then()02whenComplete() 函数,再之后执行微事件队列中最后的 scheduleMicrotask() C
    d. 之后执行事件队列末位的 1sFuture.delayed D,此时事件队列已为空;
    e. 最后执行 2s 添加到事件队列中的 Future.delayed B 及其 then() / whenComplete() 函数;

汇总小结

  1. Dart 的任务调度模型是单线程轮询,不是基于时间调度的;我们可以知道各个事件的调度顺序,但无法明确得知各个事件调度的时间;例如:延迟 2s 并非一定是 2s 后执行,需要等之前的任务调度结束后才会执行;
  2. 注意级联函数中的新的任务调度是否需要返回结果后再继续;
  3. 实际中尽量在 EventTask 中执行耗时操作,减少在 MicroTask 中执行;若任务耗时时间较长可以尝试用 isolate 开启新的异步线程执行;

      Task Queue 案例尝试


      小菜对任务调度的理解还不够深入,如有错误请多多指导!

来源: 阿策小和尚

目录
相关文章
|
1月前
|
开发框架 Dart 前端开发
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。本文从 Flutter 简介、特点、开发环境搭建、应用架构、组件详解、路由管理、状态管理、与原生代码交互、性能优化、应用发布与部署及未来趋势等方面,全面解析 Flutter 技术,助你掌握这一前沿开发工具。
57 8
|
3月前
|
Dart
如何在 Flutter 项目中使用 Dart 语言?
如何在 Flutter 项目中使用 Dart 语言?
140 58
|
1月前
|
Dart
flutter dart mixin 姿势
flutter dart mixin 姿势
|
2月前
|
Dart 开发者 Windows
flutter:dart的学习
本文介绍了Dart语言的下载方法及基本使用,包括在Windows系统上和VSCode中的安装步骤,并展示了如何运行Dart代码。此外,还详细说明了Dart的基础语法、构造函数、泛型以及库的使用方法。文中通过示例代码解释了闭包、运算符等概念,并介绍了Dart的新特性如非空断言操作符和延迟初始化变量。最后,提供了添加第三方库依赖的方法。
37 12
|
4月前
|
Dart 前端开发 JavaScript
Flutter&Dart-异步编程Future、Stream极速入门
Flutter&Dart-异步编程Future、Stream极速入门
90 4
|
4月前
|
Dart JavaScript 前端开发
Dart或Flutter中解决异常-type ‘int‘ is not a subtype of type ‘double‘
Dart或Flutter中解决异常-type ‘int‘ is not a subtype of type ‘double‘
165 4
|
4月前
|
Dart 开发工具 Android开发
Android Studio导入Flutter项目提示Dart SDK is not configured
Android Studio导入Flutter项目提示Dart SDK is not configured
414 4
|
4月前
|
Dart 安全 API
Android跨平台开发之Dart 3.5 与 Flutter 3.24:革新跨平台应用开发
【Dart 3.5 与 Flutter 3.24:革新跨平台应用开发】首发于公众号“AntDream”。本文深度解析 Dart 3.5 和 Flutter 3.24 的新特性,包括空安全强化、Web 与原生互操作性增强及 Flutter GPU API 等,展示了如何提升代码质量和用户体验。
74 1
|
4月前
|
Dart 编译器 API
Dart ffi 使用问题之在C++线程中无法直接调用Dart函数的问题如何解决
Dart ffi 使用问题之在C++线程中无法直接调用Dart函数的问题如何解决
|
4月前
|
Dart API C语言
Dart ffi 使用问题之想在C/C++中创建异步线程来调用Dart方法,如何操作
Dart ffi 使用问题之想在C/C++中创建异步线程来调用Dart方法,如何操作