Research: How to "Reduce unused `JavaScript`" in `Flutter` Web App?

With the recent deployment to `GitHub Pages`: https://github.com/dwyl/app/issues/322#issuecomment-1454603830
the `performance` score is now **`70`**: https://pagespeed.web.dev/report?url=https%3A%2F%2Fapp.dwyl.com 🎉

`while` _much_ better than the **`32`** we were seeing last week and definitely something to celebrate! 🥳
it's still **_unacceptably_ low**. 🐌
It _must_ be possible to achieve **`100`** even if we need to resort to "smoke and mirrors". 🤔

i.e: we create a "mockup" of the `App` in Pure `HTML` and `CSS` and replace the **basic `loading` screen**
with a "Useful tips" page and _deliberately_ delay downloading any `JS` using `SetTimeout` ⌛
So the page is _fully_ interactive and `PageSpeed Insights` can turn a blind eye to the `JS`. 🙈
see: https://github.com/dwyl/app/issues/325

## Reduce unused `JavaScript`

The main recommendation `PageSpeed Insights` offers is "**Reduce unused `JavaScript`**" ...
As noted in: https://github.com/dwyl/app/issues/315#issuecomment-1441279519 the `main.dart.js` file is ***massive***!!

https://github.com/dwyl/app/blob/af4e656aa5d84102f969b9ce3b336affda521ba2/main.dart.js

The `flutter.js` file doesn't _appear_ to be the problem:
https://github.com/dwyl/app/blob/af4e656aa5d84102f969b9ce3b336affda521ba2/index.html#L26
It's not a very big file, only **`376 loc`** and **`13.6kb`**: https://github.com/dwyl/app/blob/af4e656aa5d84102f969b9ce3b336affda521ba2/flutter.js

## Todo

+ [ ] Research how to reduce size of the `JS` (`main.dart.js` being the biggest file!)
e.g: can we split out the engine and our application code / business logic into separate files for parallel downloading?
+ [ ] Can we "tree-shake" the unused functions in `main.dart.js`, we're _definitely_ not using them all! See: https://github.com/flutter/flutter/issues/46589

## Starting point:

+ Basic: https://medium.com/flutter/optimizing-performance-in-flutter-web-apps-with-tree-shaking-and-deferred-loading-535fbe3cd674 - this may be outdated as it was written in 2020 ... please read and comment below.
(no ChatGPT summaries please... 😜 )
+ Reddit: this might be a bit of a rabbit hole ... don't get distracted by other noise. 💭 ⏳
https://www.reddit.com/r/FlutterDev/comments/ve81cw/strategies_to_overcome_flutter_web_loading_time/
+ Finally: deferred components: https://github.com/flutter/flutter/wiki/Deferred-Components while our `App` is small this might not have a very big impact. But as it grows this might become _essential_ for reducing the `APK` size and ensuring fast load times.
Again, this may not impact the `Web App` ... it may only be the `Android` version, but could still be worth exploring. 🔍

## Wait for `Wasm`? ⏳ 🤷‍♂️

We could just focus on building _features_ and wait patiently for `Flutter` to be compiled to `WebAssembly`
which will _eliminate_ the `JS` (or at least drastically reduce it ...) 💭
This might be a `while` ... see: https://github.com/flutter/flutter/issues/41062 and https://github.com/flutter/flutter/issues/53041#issuecomment-1405501969

I'm not holding my breath that `Flutter Web` will be compiled to `Wasm` in 2023 ... ⏳ 🤷‍♀️
And we _need_ to ship our `Flutter Web App` and get to **1k `people`** _ASAP_.

## Sponsor/Bounty a `Flutter` _Expert_? 💰

Given that we _hypothesize_ that initial `Web App` loading time
will be one of the biggest reasons for `people` to "bounce" from the `dwyl web app`,
we could figure out how to setup a "bounty" to get a `Flutter` _expert_ to help us with this.

## `priority-2`? 🔥 🤷‍♂️

`while` we would _love_ to dedicate _all_ of our resources to fixing this _immediately_. 🙏
We have done a decent amount of googling and nothing _obvious_ jumps out. 🔍 🤷‍♂️
We cannot allocate an `undefined` amount of time into this at the _expense_ of building _features_. 👎

We're assigning **`priority-2`** to this because: 2️⃣
a) this **not a _feature_** that `people` trying the `App` are going to say "wow" I **_need_ this `App`** in my life! 😍
b) it's an "***unknown unknown***" i.e. we have no idea (up-front) how long this will take to fix. 🤷‍♂️
c) there could be a "[**rug pull**](https://en.wiktionary.org/wiki/rug-pull)" in the form of: 💭
1. `Dart v3` compilation to `Wasm`: https://medium.com/dartlang/dart-3-alpha-f1458fb9d232 🤞
2. `Flutter` _eventually_ releases a new version that dramatically improves `Web` compilation. 🚀

So ... this is something we need to keep chipping away at 🧑‍💻
and leaving comments on this issue with _everything_ that we try along the way. 💬