Skip to content

Conversation

@nshahan
Copy link
Contributor

@nshahan nshahan commented May 20, 2025

[flutter_tools] Enable hot reload on the web

Update the defaults so hot reload is enabled on web development builds by default.
This enables the use of a new module representation in the compiled JavaScript.
Passing --no-web-experimental-hot-reload will disable the ability to hot reload
and return to the AMD JavaScript module representation.

This change avoids enabling hot reload in the flutter drive tests since they rely on
-d web-server which has known startup issues. When dart-lang/sdk#60289 is
resolved it should be safe to enable hot reload by default for the flutter drive
tests.

Fixes: #167510

nshahan added 8 commits May 20, 2025 11:18
Update the defaults so hot reload is enabled on web development builds
by default. This enables the use of a new module representation in the
compiled JavaScript. Passing `--no-web-experimental-hot-reload` will
disable the ability to hot reload and return to the AMD JavaScript
module representation.
@github-actions github-actions bot added the tool Affects the "flutter" command-line tool. See also t: labels. label May 20, 2025
@nshahan nshahan changed the title Enable hot reload [flutter_tools] Enable hot reload on the web May 20, 2025
@QodoAI-Agent
Copy link

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 4 🔵🔵🔵🔵⚪
🧪 PR contains tests
🔒 No security concerns identified
⚡ Recommended focus areas for review

Inconsistent Flags

The extraFrontEndOptions list is built locally for hot reload flags but the initial kernel build still uses buildInfo.extraFrontEndOptions, causing a mismatch where hot reload flags might not be applied on the initial compile.

final List<String> extraFrontEndOptions = <String>[
  ...buildInfo.extraFrontEndOptions,
  if (buildInfo.webEnableHotReload)
  // These flags are only valid to be passed when compiling with DDC.
  ...<String>['--dartdevc-canary', '--dartdevc-module-format=ddc'],
];

generator = ResidentCompiler(
  globals.artifacts!.getHostArtifact(HostArtifact.flutterWebSdk).path,
  buildMode: buildInfo.mode,
  trackWidgetCreation: buildInfo.trackWidgetCreation,
  fileSystemRoots: buildInfo.fileSystemRoots,
  // Override the filesystem scheme so that the frontend_server can find
  // the generated entrypoint code.
  fileSystemScheme: 'org-dartlang-app',
  initializeFromDill:
      buildInfo.initializeFromDill ??
      getDefaultCachedKernelPath(
        trackWidgetCreation: buildInfo.trackWidgetCreation,
        dartDefines: buildInfo.dartDefines,
        extraFrontEndOptions: buildInfo.extraFrontEndOptions,
      ),
  assumeInitializeFromDillUpToDate: buildInfo.assumeInitializeFromDillUpToDate,
  targetModel: TargetModel.dartdevc,
  frontendServerStarterPath: buildInfo.frontendServerStarterPath,
  extraFrontEndOptions: extraFrontEndOptions,
  platformDill: globals.fs.file(platformDillPath).absolute.uri.toString(),
Exception Messages

The error messages reference FlutterOptions.kExtraFrontEndOptions; ensure this constant exists and matches the intended flag name to avoid runtime or compile errors.

DdcModuleFormat get ddcModuleFormat {
  final DdcModuleFormat moduleFormat =
      webEnableHotReload ? DdcModuleFormat.ddc : DdcModuleFormat.amd;
  final DdcModuleFormat? parsedFormat =
      _ddcModuleFormatAndCanaryFeaturesFromFrontEndArgs(extraFrontEndOptions).ddcModuleFormat;
  if (parsedFormat != null && moduleFormat != parsedFormat) {
    throw Exception(
      'Unsupported option combination:\n'
      '${FlutterOptions.kWebExperimentalHotReload}: $webEnableHotReload\n'
      '${FlutterOptions.kExtraFrontEndOptions}: --dartdevc-module-format=${parsedFormat.name}',
Hot Reload Support

Removed extraFrontEndOptions in the web widget preview, which may disable hot reload support for previews; verify intended behavior and update preview scaffold options if needed.

null,
treeShakeIcons: false,
// Provide the DTD connection information directly to the preview scaffold.
// This could, in theory, be provided via a follow up call to a service extension
// registered by the preview scaffold, but there's some uncertainty around how service
// extensions will work with Flutter web embedded in VSCode without a Chrome debugger
// connection.
dartDefines: <String>['$kWidgetPreviewDtdUriEnvVar=${_dtdService.dtdUri}'],
packageConfigPath: widgetPreviewScaffoldProject.packageConfig.path,
packageConfig: PackageConfig.parseBytes(

@nshahan nshahan requested a review from matanlurey as a code owner May 29, 2025 21:26
@nshahan nshahan requested review from mdebbar and srujzs June 2, 2025 18:37
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 3, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 3, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 4, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 5, 2025
@stuartmorgan-g
Copy link
Contributor

This change avoids enabling hot reload in the flutter drive tests since they rely on
-d web-server which has known startup issues. When dart-lang/sdk#60289 is
resolved it should be safe to enable hot reload by default for the flutter drive
tests.

In the future, it would be great if you could give the Flutter ecosystem team (#hackers-ecosystem on Discord) a heads up if drive is going to be broken and requires known workarounds, as flutter/packages drives a lot of web tests.

@nshahan
Copy link
Contributor Author

nshahan commented Jun 11, 2025

@stuartmorgan-g Thanks for bringing this issue and these channels to my attention. Were meeting today to work out a hopefully quick resolution. Our aim is to fix the -d web-server issue or revert this change by the beta 3 release.

@stuartmorgan-g
Copy link
Contributor

Our aim is to fix the -d web-server issue or revert this change by the beta 3 release.

To clarify, flutter/packages runs against Flutter master, using a pinned, auto-rolled version. If temporary workarounds are necessary on master in a case like this, they will break the roller, so if we know in advance of it saves us debugging/bisecting to figure out what's going on.

antfitch added a commit to flutter/website that referenced this pull request Aug 13, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 14, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 14, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 15, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 15, 2025
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 16, 2025
@nshahan nshahan deleted the enable-hot-reload branch September 23, 2025 21:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

tool Affects the "flutter" command-line tool. See also t: labels.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[web] enable hot reload by default for web

6 participants