[Impeller] TextField widget, long text causes severe frame drop. #126562

xiaohucode · 2023-05-11T16:16:17Z

Is there an existing issue for this?

I have searched the existing issues
I have read the guide to filing a bug

Steps to reproduce

TextField widget, long text causes severe frame drop.

Expected results

There is no such issue on versions 3.9.0-10.0.pre

Actual results

Scroll, drop frame

Code sample

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late TextEditingController _textEditingController;

  @override
  void initState() {
    super.initState();
    _textEditingController = TextEditingController();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
                child: SizedBox(
              height: double.infinity,
              child: CupertinoTextField.borderless(
                controller: _textEditingController,
                maxLines: null,
              ),
            )),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            _textEditingController.text = "dome sssssssssssssssssssssssssssssssssssssssssssssss\n                   " * 4096;
          });
        },
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

[Paste your logs here]

Flutter Doctor output

Doctor output

[✓] Flutter (Channel master, 3.11.0-2.0.pre.98, on macOS 12.6 21G115 darwin-x64, locale zh-Hans-CN)
    • Flutter version 3.11.0-2.0.pre.98 on channel master at /Users/xcode/Desktop/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision dc3d6603f2 (44 minutes ago), 2023-05-11 17:31:23 +0200
    • Engine revision a0925f1581
    • Dart version 3.1.0 (build 3.1.0-94.0.dev)
    • DevTools version 2.23.1
    • Pub download mirror https://pub.flutter-io.cn
    • Flutter download mirror https://storage.flutter-io.cn

[!] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at /Users/xcode/Library/Android/sdk
    • Platform android-33, build-tools 33.0.1
    • ANDROID_HOME = /Users/xcode/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    ! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14C18
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2021.3)
    • 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.13+0-b1751.21-8125866)

[✓] VS Code (version 1.74.2)
    • VS Code at /Users/xcode/Downloads/Visual Studio Code.app/Contents
    • Flutter extension version 3.60.0

[✓] Connected device (4 available)
    • iPhone 13 Pro Max (mobile) • 00008110-           • ios            • iOS 15.6 19G71
    • iPhone 14 Pro Max (mobile) • 4CEB6FBA-0B66-455F-9AEB-D80D5D700DD1 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-16-2 (simulator)
    • macOS (desktop)            • macos                                • darwin-x64     • macOS 12.6 21G115 darwin-x64
    • Chrome (web)               • chrome                               • web-javascript • Google Chrome 113.0.5672.92

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

The text was updated successfully, but these errors were encountered:

darshankawar · 2023-05-12T07:15:08Z

@xiaohucode
Can you run in --profile mode, like flutter run --profile --trace-skia and provide the trace too ?
Also, 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 that the performance overlay is turned OFF while recording the trace.
Attach the JSON file containing your trace to your bug. You may also wish to include a screenshot of the part of the trace showing the problem you are seeing, just so that people can see at a glance what kind of performance issue the bug is about.

xiaohucode · 2023-05-12T14:11:03Z

@xiaohucode Can you run in --profile mode, like flutter run --profile --trace-skia and provide the trace too ? Also, 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 that the performance overlay is turned OFF while recording the trace. Attach the JSON file containing your trace to your bug. You may also wish to include a screenshot of the part of the trace showing the problem you are seeing, just so that people can see at a glance what kind of performance issue the bug is about.

log.zip

darshankawar · 2023-05-15T05:51:23Z

Thanks for the details @xiaohucode
Although I do see the performance spike using the code provided, I noticed that you have material 3 enabled, for which there's already an open issue which you can refer : flutter/samples#2009

Is it possible to verify if the same occurs without using material 3 ?

xiaohucode · 2023-05-15T06:26:47Z

@darshankawar
I think it has something to do with the impeller as I use the Skia very smooth.

darshankawar · 2023-05-16T05:52:00Z

Thanks for the update. Verified with and without impeller and seeing the difference as below:

With impeller:

Without impeller:

Trace as shared here.

stable, master flutter doctor -v

[!] Flutter (Channel stable, 3.10.0, on macOS 12.2.1 21D62 darwin-x64, locale
    en-GB)
    • Flutter version 3.10.0 on channel stable at
      /Users/dhs/documents/fluttersdk/flutter
    ! Warning: `flutter` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/flutter, which is not inside
      your current Flutter SDK checkout at
      /Users/dhs/documents/fluttersdk/flutter. Consider adding
      /Users/dhs/documents/fluttersdk/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/dart, which is not inside your
      current Flutter SDK checkout at /Users/dhs/documents/fluttersdk/flutter.
      Consider adding /Users/dhs/documents/fluttersdk/flutter/bin to the front
      of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 84a1e904f4 (2 days ago), 2023-05-09 07:41:44 -0700
    • Engine revision d44b5a94c9
    • Dart version 3.0.0
    • DevTools version 2.23.1
    • If those were intentional, you can disregard the above warnings; however
      it is recommended to use "git" directly to perform update checks and
      upgrades.

[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

[!] Flutter (Channel master, 3.11.0-6.0.pre.86, on macOS 12.2.1 21D62
    darwin-x64, locale en-GB)
    • Flutter version 3.11.0-6.0.pre.86 on channel master at
      /Users/dhs/documents/fluttersdk/flutter
    ! Warning: `flutter` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/flutter, which is not inside
      your current Flutter SDK checkout at
      /Users/dhs/documents/fluttersdk/flutter. Consider adding
      /Users/dhs/documents/fluttersdk/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/dart, which is not inside your
      current Flutter SDK checkout at /Users/dhs/documents/fluttersdk/flutter.
      Consider adding /Users/dhs/documents/fluttersdk/flutter/bin to the front
      of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision ea5eddb5a9 (55 minutes ago), 2023-05-15 21:39:26 -0700
    • Engine revision c4d4b40c65
    • Dart version 3.1.0 (build 3.1.0-113.0.dev)
    • DevTools version 2.23.1
    • If those were intentional, you can disregard the above warnings; however
      it is recommended to use "git" directly to perform update checks and
      upgrades.

[!] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Users/dhs/Library/Android/sdk
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for
      more details.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 13C100
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] IntelliJ IDEA Ultimate Edition (version 2021.3.2)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • Flutter plugin version 65.1.4
    • Dart plugin version 213.7228

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.29.0

[✓] Connected device (3 available)
    • Darshan's iphone (mobile) • 21150b119064aecc249dfcfe05e259197461ce23 • ios
      • iOS 15.3.1 19D52
    • macOS (desktop)           • macos                                    •
      darwin-x64     • macOS 12.2.1 21D62 darwin-x64
    • Chrome (web)              • chrome                                   •
      web-javascript • Google Chrome 109.0.5414.119

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.
      
[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

justinmc · 2023-05-18T22:27:50Z

For text editing in general we're aware that large amounts of text results in major performance problems. For example #90063. But not sure about the specific correlation with Impeller here.

jonahwilliams · 2023-05-19T16:34:59Z

I can confirm that the performance is much worse with impeller, but the difference appears to be something happening in layer tree dispatch and not actually in the impeller backend. Still investigating.

jonahwilliams · 2023-05-19T16:38:57Z

98% of frametime is being spent in flutter::DIRTree::searchAndConsolidateRects (https://github.com/flutter/engine/blob/a0ea4d2d9ea5bc0951acf0ea9b4dcaa808a92708/display_list/geometry/dl_rtree.h#L116). FYI @flar

jonahwilliams · 2023-05-19T16:48:54Z

I can confirm locally that disabling the Rtree computation causes the performance to return to reasonable levels. From a cursory reading of the code, it seems like we might have quadradic behavior if none of the rectangles intersect. At a certain number of existing rects, we should probably fall back to a less precise but faster strategy if possible.

jonahwilliams · 2023-06-05T18:42:53Z

Fixed via flutter/engine#42399

github-actions · 2023-06-20T06:01:06Z

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

darshankawar added the in triage Presently being triaged by the triage team label May 12, 2023

xiaohucode closed this as completed May 12, 2023

xiaohucode reopened this May 12, 2023

This comment was marked as duplicate.

Sign in to view

darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 12, 2023

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 12, 2023

darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 15, 2023

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 15, 2023

Piinks added the P2 Important issues not at the top of the work list label May 16, 2023

chinmaygarde changed the title ~~TextField widget, long text causes severe frame drop~~ [Impeller] TextField widget, long text causes severe frame drop. May 18, 2023

jonahwilliams self-assigned this May 19, 2023

jonahwilliams closed this as completed Jun 5, 2023

darshankawar added the r: fixed Issue is closed as already fixed in a newer version label Jun 6, 2023

github-actions bot locked as resolved and limited conversation to collaborators Jun 20, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Impeller] TextField widget, long text causes severe frame drop. #126562

[Impeller] TextField widget, long text causes severe frame drop. #126562

xiaohucode commented May 11, 2023 •

edited

This comment was marked as duplicate.

darshankawar commented May 12, 2023

xiaohucode commented May 12, 2023

darshankawar commented May 15, 2023

xiaohucode commented May 15, 2023 •

edited

darshankawar commented May 16, 2023

justinmc commented May 18, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented Jun 5, 2023

github-actions bot commented Jun 20, 2023

[Impeller] TextField widget, long text causes severe frame drop. #126562

[Impeller] TextField widget, long text causes severe frame drop. #126562

Comments

xiaohucode commented May 11, 2023 • edited

Is there an existing issue for this?

Steps to reproduce

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

This comment was marked as duplicate.

darshankawar commented May 12, 2023

xiaohucode commented May 12, 2023

darshankawar commented May 15, 2023

xiaohucode commented May 15, 2023 • edited

darshankawar commented May 16, 2023

justinmc commented May 18, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented May 19, 2023

jonahwilliams commented Jun 5, 2023

github-actions bot commented Jun 20, 2023

xiaohucode commented May 11, 2023 •

edited

xiaohucode commented May 15, 2023 •

edited