Issue: Flutter Web Build Times Too Slow, Hanging at a Certain Point

In this issue report, developers are encountering slow build times in Flutter web projects, with the process hanging at a certain stage. Despite attempts to diagnose the issue, including version comparisons and command adjustments, the problem persists. A reproducible code sample is requested for further investigation.

Description

Flutter web build process is taking significantly longer than usual, hanging at a particular stage of execution.

Issue Details

• Steps to Reproduce: Unable to reproduce on a newly created Flutter project.
• Expected Results: Previously, Flutter build web used to execute fairly quickly (under a minute), but now it takes 20 minutes or longer.
• Actual Results: Hangs during execution at a specific point, as shown in the verbose output.

Verbose Output

[   +9 ms] web_entrypoint: Complete
[        ] dart2js: Starting due to {}
[   +7 ms] executing:mypath/flutter/bin/cache/dart-sdk/bin/dart --disable-dart-dev mypath/flutter/bin/cache/dart-sdk/bin/snapshots/dart2js.dart.snapshot
--platform-binaries=mypath/flutter/bin/cache/flutter_web_sdk/kernel --invoker=flutter_tool -Ddart.vm.product=true
-DFLUTTER_WEB_CANVASKIT_URL=https://www.gstatic.com/flutter-canvaskit/f6344b75dcf861d8bf1f1322780b8811f982e31a/ -DFLUTTER_WEB_AUTO_DETECT=false -DFLUTTER_WEB_USE_SKIA=true --native-null-assertions
--no-source-maps -o mypath/project/.dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/app.dill --packages=.dart_tool/package_config.json --cfe-only
mypath/project/.dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/main.dart
[+65152 ms] Compiled 72,847,773 input bytes (64,335,062 characters source) to 74,774,040 kernel bytes in 64.7 seconds using 1257.250 MB of memory
                     Dart file .dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/main.dart compiled to dill: .dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/app.dill.
[        ] executing: mypath/flutter/bin/cache/dart-sdk/bin/dart --disable-dart-dev mypath/flutter/bin/cache/dart-sdk/bin/snapshots/dart2js.dart.snapshot
--platform-binaries=/mypath/flutter/bin/cache/flutter_web_sdk/kernel --invoker=flutter_tool -Ddart.vm.product=true
-DFLUTTER_WEB_CANVASKIT_URL=https://www.gstatic.com/flutter-canvaskit/f6344b75dcf861d8bf1f1322780b8811f982e31a/ -DFLUTTER_WEB_AUTO_DETECT=false -DFLUTTER_WEB_USE_SKIA=true --native-null-assertions
--no-source-maps -O4 -o mypath/.dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/main.dart.js
mypath/project/.dart_tool/flutter_build/2bc6bf09fa388c3aa3580c6c6256f0e7/app.dill

Environment Details

• Flutter Version: Channel stable, 3.22.0
• Operating System: macOS 14.4 23E214 darwin-x64
• Locale: en-GB
• Android Toolchain: Develop for Android devices (Android SDK version 34.0.0) – cmdline-tools component is missing. Android license status unknown.
• Other Tools: Xcode, Chrome, Android Studio, IntelliJ IDEA Community Edition, VS Code

Comments and Suggestions

• @darshankawar suggests checking if the issue persists in previous Flutter versions and recommends trying flutter build web –release to see if it improves.
• @nialljawad96 confirms the issue is present in version 3.22.0 but not in 3.16.4 and below, and shares additional verbose output.
• @mokamhawy reports a similar issue on Windows desktop with Flutter version 3.22.

Action Required

• @darshankawar requests a reproducible code sample to investigate and address the slow build time issue effectively.

Also read:

Issue: Flutter 3.22 different behavior between debug and release mode

Highlights from Google I/O 2024: Exciting Announcements

Information in Table Format

Content	Description
Issue:	Flutter Web Build Times Too Slow, Hanging at a Certain Point
Description:	Flutter web build process is taking significantly longer than usual, hanging at a particular stage of execution.
Issue Details:	– Steps to Reproduce: Unable to reproduce on a newly created Flutter project. – Expected Results: Previously, Flutter build web used to execute fairly quickly (under a minute), but now it takes 20 minutes or longer. – Actual Results: Hangs during execution at a specific point, as shown in the verbose output.
Verbose Output:	See provided snippet for detailed verbose output during the build process.
Environment Details:	– Flutter Version: Channel stable, 3.22.0 – Operating System: macOS 14.4 23E214 darwin-x64 – Locale: en-GB – Android Toolchain: Develop for Android devices (Android SDK version 34.0.0) – cmdline-tools component is missing. Android license status unknown. – Other Tools: Xcode, Chrome, Android Studio, IntelliJ IDEA Community Edition, VS Code
Comments and Suggestions:	– @darshankawar suggests checking if the issue persists in previous Flutter versions and recommends trying flutter build web –release to see if it improves. – @nialljawad96 confirms the issue is present in version 3.22.0 but not in 3.16.4 and below, and shares additional verbose output. – @mokamhawy reports a similar issue on Windows desktop with Flutter version 3.22.
Action Required:	– @darshankawar requests a reproducible code sample to investigate and address the slow build time issue effectively.

Join Our Whatsapp Group

Join Telegram group

FAQs: Flutter Web Build Times

Why is my Flutter web build process taking so long?

Answer: If your Flutter web build process is hanging at a certain point and taking longer than usual, it could be due to various factors such as complex code, large project size, or issues with the Flutter framework itself. Additionally, updates to Flutter versions may introduce performance differences.

How can I troubleshoot slow Flutter web builds?

Answer: To troubleshoot slow Flutter web builds, you can try the following steps:

1. Check if the issue persists in previous Flutter versions.
2. Ensure your project code is optimized and does not contain any unnecessary complexities.
3. Experiment with different build configurations, such as using the –release flag or changing web renderer options.
4. Monitor system resources during the build process to identify any bottlenecks.

What should I do if my Flutter web build hangs during execution?

Answer: If your Flutter web build hangs at a specific point during execution, you can try the following steps:

1. Review the verbose output to identify the stage at which the build is hanging.
2. Check for any errors or warnings that might indicate underlying issues.
3. Consider restarting the build process or clearing caches to resolve any temporary issues.
4. If the problem persists, consider reaching out to the Flutter community for assistance or filing a bug report with Flutter’s official GitHub repository.

Join Our Whatsapp Group

Join Telegram group

How can I provide feedback or report issues related to Flutter web builds?

Answer: You can provide feedback or report issues related to Flutter web builds by:

1. Joining the Flutter community forums or Discord channels to discuss your experiences and seek assistance from other developers.
2. Filing a detailed bug report on Flutter’s official GitHub repository, including relevant information such as verbose output, environment details, and steps to reproduce the issue.
3. Engaging with Flutter developers and contributors on social media platforms or attending Flutter-related events to share your feedback directly.