Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flutter Web Bootstrapping Improvements #144434

Merged
merged 30 commits into from
Mar 12, 2024

Conversation

eyebrowsoffire
Copy link
Contributor

@eyebrowsoffire eyebrowsoffire commented Feb 29, 2024

This makes several changes to flutter web app bootstrapping.

  • The build now produces a flutter_bootstrap.js file.
    • By default, this file does the basic streamlined startup of a flutter app with the service worker settings and no user configuration.
    • The user can also put a flutter_bootstrap.js file in the web subdirectory in the project directory which can have whatever custom bootstrapping logic they'd like to write instead. This file is also templated, and can use any of the tokens that can be used with the index.html (with the exception of {{flutter_bootstrap_js}}, see below).
  • Introduced a few new templating tokens for index.html:
    • {{flutter_js}} => inlines the entirety of flutter.js
    • {{flutter_service_worker_version}} => replaced directly by the service worker version. This can be used instead of the script that sets the serviceWorkerVersion local variable that we used to have by default.
    • {{flutter_bootstrap_js}} => inlines the entirety of flutter_bootstrap.js (this token obviously doesn't apply to flutter_bootstrap.js itself).
  • Changed IndexHtml to be called WebTemplate instead, since it is used for more than just the index.html now.
  • We now emit warnings at build time for certain deprecated flows:
    • Warn on the old service worker version pattern (i.e.(const|var) serviceWorkerVersion = null) and recommends using {{flutter_service_worker_version}} token instead
    • Warn on use of FlutterLoader.loadEntrypoint and recommend using FlutterLoader.load instead
    • Warn on manual loading of flutter_service_worker.js.
  • The default index.html on flutter create now uses an async script tag with flutter_bootstrap.js.

@github-actions github-actions bot added the tool Affects the "flutter" command-line tool. See also t: labels. label Feb 29, 2024
@eyebrowsoffire eyebrowsoffire changed the title Support inlining flutter.js into index.html. Flutter Web Bootstrapping Improvements Mar 6, 2024
@eyebrowsoffire eyebrowsoffire marked this pull request as ready for review March 6, 2024 21:31
Copy link
Member

@ditman ditman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Man, this looks GREAT. I'm updating one of my test apps to use this, see how it goes!

dev/a11y_assessments/web/index.html Outdated Show resolved Hide resolved
Co-authored-by: David Iglesias <ditman@gmail.com>
Copy link
Member

@ditman ditman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have been testing this, and it's great. I wonder if the flutter_bootstrap.js file could be minified!

Also, somewhat unrelated to this PR (but IMO relevant for the feature); it'd be nice to have more feedback when the flutter bootstrap falls-back to JS, why.

Right now I have an application deployed that I'd expect to see in --wasm, but it's falling back to JS (in a supposedly supported browser), and I don't know why!

@@ -58,11 +68,42 @@ class IndexHtml {
return stripLeadingSlash(stripTrailingSlash(baseHref));
}

List<WebTemplateWarning> getWarnings() {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not sure if possible, but it'd be nice that these warnings were also emitted on flutter run.

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 14, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 15, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 16, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Mar 16, 2024
atsansone pushed a commit to atsansone/website that referenced this pull request Mar 18, 2024
_Description of what this PR is changing or adding, and why:_

Update Wasm getting started instructions to:
- Simplify a bit
- Rely on the standard template to ensure they are compatible
- Align with bootstrap changes landed in
flutter/flutter#144434

## Presubmit checklist

- [ ] This PR doesn’t contain automatically generated corrections
(Grammarly or similar).
- [ ] This PR follows the [Google Developer Documentation Style
Guidelines](https://developers.google.com/style) — for example, it
doesn’t use _i.e._ or _e.g._, and it avoids _I_ and _we_ (first person).
- [ ] This PR uses [semantic line
breaks](https://github.com/dart-lang/site-shared/blob/main/doc/writing-for-dart-and-flutter-websites.md#semantic-line-breaks)
of 80 characters or fewer.
atsansone pushed a commit to atsansone/website that referenced this pull request Apr 5, 2024
_Description of what this PR is changing or adding, and why:_

Update Wasm getting started instructions to:
- Simplify a bit
- Rely on the standard template to ensure they are compatible
- Align with bootstrap changes landed in
flutter/flutter#144434

## Presubmit checklist

- [ ] This PR doesn’t contain automatically generated corrections
(Grammarly or similar).
- [ ] This PR follows the [Google Developer Documentation Style
Guidelines](https://developers.google.com/style) — for example, it
doesn’t use _i.e._ or _e.g._, and it avoids _I_ and _we_ (first person).
- [ ] This PR uses [semantic line
breaks](https://github.com/dart-lang/site-shared/blob/main/doc/writing-for-dart-and-flutter-websites.md#semantic-line-breaks)
of 80 characters or fewer.
sfshaza2 added a commit to flutter/website that referenced this pull request May 7, 2024
This updates the documentation to be in line with the new changes to
bootstrapping that are coming in this PR:
flutter/flutter#144434

---------

Co-authored-by: Shams Zakhour (ignore Sfshaza) <44418985+sfshaza2@users.noreply.github.com>
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request May 14, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
autosubmit Merge PR when tree becomes green via auto submit App tool Affects the "flutter" command-line tool. See also t: labels.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants