Repository: flutter
Issue: Dart IO WebSocket.add() slows down entire UI
Labels: engine,c: performance,dependency: dart,has reproducible steps,P2,dependency: dart:io,found in release: 2.10,found in release: 2.13,team-engine,triaged-engine

<!-- Thank you for using Flutter!

     If you are looking for support, please check out our documentation
     or consider asking a question on Stack Overflow:
      * https://flutter.dev/
      * https://api.flutter.dev/
      * https://stackoverflow.com/questions/tagged/flutter?sort=frequent

     If you have found a performance problem, then fill out the template below.
     Please read our guide to filing a bug first: https://flutter.dev/docs/resources/bug-reports
-->

## Details


1.  Please tell us exactly how to reproduce the problem you are running into.
Refer to below piece of code. Even when main isolate call this without await, this function will greatly decrease the FPS.
WebSocket.add() operation will complete in 50-200us, which is pretty fast.
But seems after WebSocket.add(), system has some heavy work and slowing down the UI.
```
  static Future sendData() async {
    // Generate 16M data
    // this is one time operation, doesn't impact demo
    var list = Iterable<int>.generate(1024 * 1024 * 16, (int x) => 0).toList();
    var websocket = await WebSocket.connect("ws://localhost:8080",
        compression: CompressionOptions.compressionOff);
    while (true) {
      await Future.delayed(const Duration(microseconds: 100)); // Give UI a chance to breath
      websocket.add(list); // add it self complete very fast, but UI starts to hang/slow after this.
    }
  }
```

3.  Please attach a small application (ideally just one main.dart file) that
A full working demo code can be found in here: https://github.com/yangyuan/flutter-issues/blob/websocket/lib/demo.dart
I put a CircularProgressIndicator() in UI to prove the low FPS.
Note this source code has both host and client. I tried to use two devices, one for server and one for client. And client side will have the slow UI issue.

4.  Switch flutter to master channel and run this app on a physical device
     using profile mode with Skia tracing enabled, as follows:
       master channel and physical device behaves same.

<!--
5.  Record a video of the performance issue using another phone so we
     can have an intuitive understanding of what happened. Don’t use
     "adb screenrecord", as that affects the performance of the profile run.

6.  Open Observatory and save a timeline trace of the performance issue
     so we know which functions might be causing it. See "How to Collect
     and Read Timeline Traces" on this blog post:
       https://medium.com/flutter/profiling-flutter-applications-using-the-timeline-a1a434964af3#a499
     Make sure the performance overlay is turned OFF when recording the
     trace as that may affect the performance of the profile run.
     (Pressing ‘P’ on the command line toggles the overlay.)
-->

<!--
     Please tell us which target platform(s) the problem occurs (Android / iOS / Web / macOS / Linux / Windows)
     Which target OS version, for Web, browser, is the test system running?
     Does the problem occur on emulator/simulator as well as on physical devices?
-->

Tested on macOS, Windows, Android, iOS
In Windows it seems smooth, but not for other platforms.
My Windows device and macOS device has similar computing capability.
All physical devices.


## Logs

<details>
<summary>Logs</summary>

<!--
     Run `flutter analyze` and attach any output of that command below.
     If there are any analysis errors, try resolving them before filing this issue.
-->

```
flutter analyze
Analyzing flutter-issues...                                             
No issues found! (ran in 4.6s)

```

<!-- Finally, paste the output of running `flutter doctor -v` here, with your device plugged in. -->

```
flutter doctor -v
[✓] Flutter (Channel stable, 2.10.5, on macOS 12.3.1 21E258 darwin-x64, locale en-US)
    • Flutter version 2.10.5 at /Users/yuanyang/Apps/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5464c5bac7 (3 weeks ago), 2022-04-18 09:55:37 -0700
    • Engine revision 57d3bac3dd
    • Dart version 2.16.2
    • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    • Android SDK at /Users/yuanyang/Library/Android/sdk
    • Platform android-32, build-tools 32.1.0-rc1
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7590822)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2021.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7590822)

[✓] VS Code (version 1.66.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.40.0

[✓] Connected device (3 available)
    • Pixel 5 (mobile) • 09231FDD4003YW • android-arm64  • Android 12 (API 31)
    • macOS (desktop)  • macos          • darwin-x64     • macOS 12.3.1 21E258 darwin-x64
    • Chrome (web)     • chrome         • web-javascript • Google Chrome 101.0.4951.54

[✓] HTTP Host Availability
    • All required HTTP hosts are available

```

</details>