I explained a thread programming for wevdev and flutter for web in this document.
We could use isolate in Flutter to implement thread programming.
But, Flutter For Web is not support isolate now.
In this document, Use Worker instead of Isolate.
Dart's unsynchronized programming
Dart:isolate
We can use dart:isolate.
import 'dart:isolate' as iso;
Future main() async {
iso.ReceivePort receivePort = iso.ReceivePort();
iso.Isolate.spawn(workerMain, receivePort.sendPort);
receivePort.listen((message) {
print("host: ${message}");
});
}
workerMain(sendPort) async {
for(var message in ["01","02","03"]) {
(sendPort as iso.SendPort).send(message);
await Future.delayed(Duration(seconds: 1));
}
}
Worker for web
dart1 support dart:isolate, but darr2 not suport isoate for web now.
dart1 used worker to impolement isolate.
Let's use Worker, following Dart1 series dart:isolate.
parent.dart
import 'dart:html' as html;
main() async {
if(html.Worker.supported) {
var myWorker = new html.Worker("ww.dart.js");
myWorker.onMessage.listen((event) {
print("main:receive: ${event.data}");
});
myWorker.postMessage("Hello!!");
} else {
print('Your browser doesn\'t support web workers.');
}
}
child.dart
import 'dart:async';
import 'dart:html' as html;
import 'dart:js' as js;
import 'package:js/js.dart' as pjs;
import 'package:js/js_util.dart' as js_util;
@pjs.JS('self')
external dynamic get globalScopeSelf;
Stream<T> callbackToStream<J, T>(String name, T Function(J jsValue) unwrapValue) {
var controller = StreamController<T>.broadcast(sync: true);
js_util.setProperty(js.context['self'], name, js.allowInterop((J event) {
controller.add(unwrapValue(event));
}));
return controller.stream;
}
void jsSendMessage( dynamic object, dynamic m) {
js.context.callMethod('postMessage',[m]);
}
main() {
callbackToStream('onmessage', (html.MessageEvent e) {
return js_util.getProperty(e, 'data');
}).listen((message) {
print('>>> ${message}');
jsSendMessage(js.context, 'callback: ${message}');
});
}
PS
if send message parent to child at isoalte
import 'dart:isolate' as iso;
Future<int> main(List<String> args, iso.SendPort sendPoet) async {
print("Start Main");
iso.ReceivePort receivePort = iso.ReceivePort();
receivePort.listen((message) {
print("main:receive: ${message}");
if(message is iso.SendPort) {
(message as iso.SendPort).send("Hello!! Client");
}
});
await iso.Isolate.spawnUri(new Uri.file("./child.dart"), [], receivePort.sendPort);
return 0;
}
import 'dart:isolate' as iso;
int main(List<String> args, iso.SendPort sendPort) {
print("Hello, World!!");
sendPort.send("Start a child");
iso.ReceivePort receivePort = iso.ReceivePort();
receivePort.listen((message) {
print("child: receive message: ${message}");
sendPort.send(message);
});
sendPort.send(receivePort.sendPort);
return 0;
}
dart2native restriction
iso.Isolate.spawnUri has a limitation at dart2native
Unsupported operation: Isolate.spawnUri is not supported when using AOT compilation
wevbdec ristriction
failed to build worker at webdev serve .
you must to build manually
dart2js web/xxx.dart -o web/xxx.dart.js
Code
https://github.com/kyorohiro/dart.tiny_worker
Next..
About common intreface for flutter and flutter for web and dart:io
Top comments (2)
qiita.com/kyorohiro/items/8dda45cd...
live programming demo
worker in flutter for web, instead of isolate
dev.to/kyorohiro/dart-x-flutter-mo...