Flutter

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

ContentDescription
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

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.

Nilesh Payghan

Recent Posts

Auth0 vs Firebase

When choosing an authentication service for your application, two popular options are Auth0 and Firebase.…

20 hours ago

Celebrating Family Connections: Flutterwave’s Insights and Innovations on International Day of Family Remittances (IDFR) 2024

In honor of the International Day of Family Remittances (IDFR) 2024, Flutterwave, Africa's leading payment…

2 weeks ago

PadhAI App Smashes UPSC Exam with 170 out of 200 in Under 7 Minutes!

PadhAI, a groundbreaking AI app, has stunned the education world by scoring 170 out of…

2 weeks ago

Free Vector Database

Vector databases are essential for managing high-dimensional data efficiently, making them crucial in fields like…

2 weeks ago

Flutter App Development Services: A Hilarious Journey Through the World of Flutter

Welcome to the whimsical world of Flutter app development services! From crafting sleek, cross-platform applications…

2 weeks ago

Flutter App Development

Flutter, Google's UI toolkit, has revolutionized app development by enabling developers to build natively compiled…

2 weeks ago