From dd23663606bff3808af92ea75c7bd61ad3055262 Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Sun, 22 Sep 2024 21:03:44 -0500 Subject: [PATCH 1/6] refactor: swap out xmlhttprequest for fetch Resolves: #32 --- __brick__/web/flutter_bootstrap.js | 29 +++++++++++------------------ 1 file changed, 11 insertions(+), 18 deletions(-) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index f69eace..bd36bfd 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -41,24 +41,17 @@ async function beginPreloading() { } async function load(url) { - return new Promise((resolve, reject) => { - const req = new XMLHttpRequest(); - - req.onload = function() { - if (req.status >= 200 && req.status < 300) { - resolve(req.response); - } else { - reject(new Error(`Failed to load: ${req.status} ${req.statusText}`)); - } - }; - - req.onerror = function() { - reject(new Error('Network error')); - }; - - req.open('GET', url); - req.send(); - }); + try { + const response = await fetch(url); + if (!response.ok) { + throw new Error( + `Failed to load: ${response.status} ${response.statusText}`, + ); + } + return await response.text(); + } catch (error) { + throw new Error("Network error"); + } } async function loadBatch(urls) { From 7cf17bed53e334bfed379be881c527ab8a5ce27d Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Sun, 22 Sep 2024 21:04:39 -0500 Subject: [PATCH 2/6] perf: drop unnecessary async modifier Should drop a single microtask. Doesn't really make a difference in practice, but it doesn't hurt either. --- __brick__/web/flutter_bootstrap.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index bd36bfd..eca54ba 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -31,7 +31,7 @@ async function beginPreloading() { progressIndicator.style.width = '0%'; progressText.textContent = `Loaded ${loadedAssets} of ${totalAssets} assets`; - async function reportProgress() { + function reportProgress() { loadedAssets++; const value = Math.floor((loadedAssets / totalAssets) * 100) + '%'; From 4eb4c192fb4e7f72cef8dec9a429ff53eefc3e8d Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Sun, 22 Sep 2024 21:05:24 -0500 Subject: [PATCH 3/6] refactor: use async-await to load the data --- __brick__/web/flutter_bootstrap.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index eca54ba..d3a96fb 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -55,7 +55,10 @@ async function beginPreloading() { } async function loadBatch(urls) { - const loadPromises = urls.map(url => load(url).then(reportProgress())); + const loadPromises = urls.map(async (url) => { + await load(url); + reportProgress(); + }); try { return await Promise.all(loadPromises); } catch (error) { From a7eb02c9b53511c7b79e431f155004707a73e2be Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Sun, 22 Sep 2024 21:05:34 -0500 Subject: [PATCH 4/6] style: remove random spaces --- __brick__/web/flutter_bootstrap.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index d3a96fb..0150544 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -60,9 +60,9 @@ async function beginPreloading() { reportProgress(); }); try { - return await Promise.all(loadPromises); + return await Promise.all(loadPromises); } catch (error) { - console.error('Error loading one or more asset:', error); + console.error('Error loading one or more asset:', error); } } From a05191b5b2f2f60795a1ed86bd77728ad39bce4c Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Sun, 22 Sep 2024 21:07:28 -0500 Subject: [PATCH 5/6] refactor: don't use nested functions --- __brick__/web/flutter_bootstrap.js | 62 +++++++++++++++--------------- 1 file changed, 31 insertions(+), 31 deletions(-) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index 0150544..a0da5c4 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -31,44 +31,44 @@ async function beginPreloading() { progressIndicator.style.width = '0%'; progressText.textContent = `Loaded ${loadedAssets} of ${totalAssets} assets`; - function reportProgress() { - loadedAssets++; + for (let i = 0; i < assets.length; i += batchSize) { + const batch = assets.slice(i, i + batchSize); + await loadBatch(batch); + } +} - const value = Math.floor((loadedAssets / totalAssets) * 100) + '%'; - progressIndicator.style.width = value; +function reportProgress() { + loadedAssets++; - progressText.textContent = `Loaded ${loadedAssets} of ${totalAssets} assets`; - } + const value = Math.floor((loadedAssets / totalAssets) * 100) + '%'; + progressIndicator.style.width = value; - async function load(url) { - try { - const response = await fetch(url); - if (!response.ok) { - throw new Error( - `Failed to load: ${response.status} ${response.statusText}`, - ); - } - return await response.text(); - } catch (error) { - throw new Error("Network error"); - } - } + progressText.textContent = `Loaded ${loadedAssets} of ${totalAssets} assets`; +} - async function loadBatch(urls) { - const loadPromises = urls.map(async (url) => { - await load(url); - reportProgress(); - }); - try { - return await Promise.all(loadPromises); - } catch (error) { - console.error('Error loading one or more asset:', error); +async function load(url) { + try { + const response = await fetch(url); + if (!response.ok) { + throw new Error( + `Failed to load: ${response.status} ${response.statusText}`, + ); } + return await response.text(); + } catch (error) { + throw new Error("Network error"); } +} - for (let i = 0; i < assets.length; i += batchSize) { - const batch = assets.slice(i, i + batchSize); - await loadBatch(batch); +async function loadBatch(urls) { + const loadPromises = urls.map(async (url) => { + await load(url); + reportProgress(); + }); + try { + return await Promise.all(loadPromises); + } catch (error) { + console.error('Error loading one or more asset:', error); } } From 302174e0a6cd2a1c4c7af2b9f2252251c4986632 Mon Sep 17 00:00:00 2001 From: Eli <88557639+lishaduck@users.noreply.github.com> Date: Thu, 3 Oct 2024 10:39:35 -0500 Subject: [PATCH 6/6] fix: use strict mode, not sloppy mode This could theoretically change behavior for `{{flutter_js}}`, but I think it's fine. --- __brick__/web/flutter_bootstrap.js | 1 + 1 file changed, 1 insertion(+) diff --git a/__brick__/web/flutter_bootstrap.js b/__brick__/web/flutter_bootstrap.js index a0da5c4..78069ec 100644 --- a/__brick__/web/flutter_bootstrap.js +++ b/__brick__/web/flutter_bootstrap.js @@ -1,3 +1,4 @@ +"use strict"; {{=<% %>=}}{{flutter_js}}<%={{ }}=%> {{=<% %>=}}{{flutter_build_config}}<%={{ }}=%>