🚅
【Flutter】Isolateの基礎知識
【Flutter】Isolate
はじめに
-
【参考】公式サイト
-
【参考】サイト
-
FlutterでIsolateを用いた並列処理をするべきシーンとそのやり方 | by mono | Flutter 🇯🇵 | Medium
- 必要に応じて
compute
関数で並列処理をすると、基本シングルスレッドのFlutterでもユーザー体験を損ねることなくヘビーな処理をさばける、という話
- 必要に応じて
-
FlutterでIsolateを用いた並列処理をするべきシーンとそのやり方 | by mono | Flutter 🇯🇵 | Medium
-
実行環境
-
DartPadやAndroid Studio等で実行
- Dart SDK 2.10.4
-
DartPadやAndroid Studio等で実行
事前知識
-
Dartはシングルスレッド(メモリの競合は起こらない仕組み)
-
並行処理を実施する場合に、アイソレート(Isolate)という仕組みを利用
- 各Isolateでメモリは共有しない
- 各Isolateでデータのやりとりはメッセージを利用
-
作成方法
-
Isolate.spawn
関数('dart:isolate'
利用) -
compute
関数('package:flutter/foundation.dart';
利用)- Isolate をラップした
compute
関数の方がシンプル
- Isolate をラップした
-
-
その他基本知識、知りたいことはFlutterでIsolateを用いた並列処理をするべきシーンとそのやり方 | by mono | Flutter 🇯🇵 | Mediumに丁寧な記載があった
- 簡単な確認のみ以下実施
compute
関数の確認
-
compute
関数を利用しないで、時間が掛かる処理を実施する場合- 画面がカクつく
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
CircularProgressIndicator(),
RaisedButton(
child: Text('HeavyTask Start'),
onPressed: () async {
final result = heavyTask(1000000000); // 画面がカクつく
// final result = await compute(heavyTask, 1000000000); // 画面がカクつかない
print(result);
},
)
],
),
);
}
}
String heavyTask(int value) {
String res;
// 時間が掛かる処理と仮定
for (int i = 0; i < value; ++i) {
if (i == value - 1) res = 'Finish heavyTask!';
}
return res;
}
実行結果
-
compute
関数を利用しないで、時間が掛かる処理を実施する場合- 画面がカクつかない
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
CircularProgressIndicator(),
RaisedButton(
child: Text('HeavyTask Start'),
onPressed: () async {
// final result = heavyTask(1000000000); // 画面がカクつく
final result = await compute(heavyTask, 1000000000); // 画面がカクつかない
print(result);
},
)
],
),
);
}
}
String heavyTask(int value) {
String res;
// 時間が掛かる処理と仮定
for (int i = 0; i < value; ++i) {
if (i == value - 1) res = 'Finish heavyTask!';
}
return res;
}
実行結果
Discussion