TF-3256 Update index.html cache config
This commit is contained in:
@@ -36,7 +36,7 @@ isolateManager.execute(
|
|||||||
- Communicate between two isolates
|
- Communicate between two isolates
|
||||||
To see a visual representation of this process, take a look at the image below:
|
To see a visual representation of this process, take a look at the image below:
|
||||||
|
|
||||||
[communicate_between_two_isolate](../images/handle_task_with_isolate.png);
|
<img src="../images/handle_task_with_isolate.png" alt="communicate_between_two_isolate">
|
||||||
|
|
||||||
## Consequences
|
## Consequences
|
||||||
|
|
||||||
@@ -45,4 +45,4 @@ To see a visual representation of this process, take a look at the image below:
|
|||||||
|
|
||||||
## Reference
|
## Reference
|
||||||
|
|
||||||
- [worker_manager](https://pub.dev/packages/worker_manager)
|
- <img src="../images/handle_task_with_isolate.png" alt="worker_manager">
|
||||||
|
|||||||
@@ -0,0 +1,24 @@
|
|||||||
|
# 54. Update Flutter Service Worker Initialization
|
||||||
|
|
||||||
|
Date: 2024-11-15
|
||||||
|
|
||||||
|
## Status
|
||||||
|
|
||||||
|
Accepted
|
||||||
|
|
||||||
|
## Context
|
||||||
|
|
||||||
|
- Since the new version of Flutter, old initialization of Flutter Service Worker does not work.
|
||||||
|
- Version is always null
|
||||||
|
- Twake Mail web resources is requested everytime the web is loaded, no cache is used <img src="../images/before-flutter-3.22.png">
|
||||||
|
- One hard-reload, one normal reload
|
||||||
|
|
||||||
|
## Decision
|
||||||
|
|
||||||
|
- We update the initialization of Flutter Service Worker according to the new version of Flutter
|
||||||
|
- More reference: https://docs.flutter.dev/platform-integration/web/initialization
|
||||||
|
|
||||||
|
## Consequences
|
||||||
|
|
||||||
|
- Twake Mail web use cache resources to improve performance <img src="../images/after-flutter-3.22.png">
|
||||||
|
- One hard-reload, many normal reload
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 243 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 254 KiB |
+14
-1
@@ -99,7 +99,20 @@
|
|||||||
application. For more information, see:
|
application. For more information, see:
|
||||||
https://developers.google.com/web/fundamentals/primers/service-workers -->
|
https://developers.google.com/web/fundamentals/primers/service-workers -->
|
||||||
<script>
|
<script>
|
||||||
loadLanguageResources().finally(initialWorkerService);
|
{{flutter_js}}
|
||||||
|
{{flutter_build_config}}
|
||||||
|
|
||||||
|
loadLanguageResources().finally(initialTmailApp);
|
||||||
|
|
||||||
|
_flutter.loader.load({
|
||||||
|
serviceWorkerSettings: {
|
||||||
|
serviceWorkerVersion: {{flutter_service_worker_version}},
|
||||||
|
},
|
||||||
|
onEntrypointLoaded: async function(engineInitializer) {
|
||||||
|
const appRunner = await engineInitializer.initializeEngine();
|
||||||
|
await appRunner.runApp();
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<script src="https://unpkg.com/pica/dist/pica.min.js" ></script>
|
<script src="https://unpkg.com/pica/dist/pica.min.js" ></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@@ -3,66 +3,10 @@ const iosStore = 'https://apps.apple.com/app/twake-mail/id1587086189';
|
|||||||
const iosPlatform = 'iOS';
|
const iosPlatform = 'iOS';
|
||||||
const androidPlatform = 'android';
|
const androidPlatform = 'android';
|
||||||
const otherPlatform = 'other';
|
const otherPlatform = 'other';
|
||||||
const timeoutDuration = 4000;
|
|
||||||
var scriptLoaded = false;
|
|
||||||
|
|
||||||
function loadMainDartJs() {
|
|
||||||
if (scriptLoaded) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
scriptLoaded = true;
|
|
||||||
var scriptTag = document.createElement('script');
|
|
||||||
scriptTag.src = 'main.dart.js';
|
|
||||||
scriptTag.type = 'application/javascript';
|
|
||||||
document.body.append(scriptTag);
|
|
||||||
}
|
|
||||||
|
|
||||||
function fetchServiceWorker() {
|
|
||||||
if ('serviceWorker' in navigator) {
|
|
||||||
// Service workers are supported. Use them.
|
|
||||||
// Wait for registration to finish before dropping the <script>tag.
|
|
||||||
// Otherwise, the browser will load the script multiple times,
|
|
||||||
// potentially different versions.
|
|
||||||
navigator.serviceWorker.register('flutter_service_worker.js?v={{flutter_service_worker_version}}')
|
|
||||||
.then((reg) => {
|
|
||||||
function waitForActivation(serviceWorker) {
|
|
||||||
serviceWorker.addEventListener('statechange', () => {
|
|
||||||
if (serviceWorker.state == 'activated') {
|
|
||||||
console.log('[TwakeMail] fetchServiceWorker(): Installed new service worker.');
|
|
||||||
loadMainDartJs();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (!reg.active && (reg.installing || reg.waiting)) {
|
|
||||||
// No active web worker and we have installed or are installing
|
|
||||||
// one for the first time. Simply wait for it to activate.
|
|
||||||
waitForActivation(reg.installing || reg.waiting);
|
|
||||||
} else {
|
|
||||||
// Existing service worker is still good.
|
|
||||||
console.log('[TwakeMail] fetchServiceWorker(): Loading app from service worker.');
|
|
||||||
loadMainDartJs();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// If service worker doesn't succeed in a reasonable amount of time,
|
|
||||||
// fallback to plaint <script> tag.
|
|
||||||
setTimeout(() => {
|
|
||||||
if (!scriptLoaded) {
|
|
||||||
console.warn(
|
|
||||||
'[TwakeMail] fetchServiceWorker(): Failed to load app from service worker. Falling back to plain <script> tag.',
|
|
||||||
);
|
|
||||||
loadMainDartJs();
|
|
||||||
}
|
|
||||||
}, timeoutDuration);
|
|
||||||
} else {
|
|
||||||
// Service workers not supported. Just drop the <script> tag.
|
|
||||||
loadMainDartJs();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleContinueTwakeMailOnWeb() {
|
function handleContinueTwakeMailOnWeb() {
|
||||||
console.info('[TwakeMail] handleContinueTwakeMailOnWeb(): Continue on web.');
|
console.info('[TwakeMail] handleContinueTwakeMailOnWeb(): Continue on web.');
|
||||||
closeSmartBanner();
|
closeSmartBanner();
|
||||||
fetchServiceWorker();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPlatform() {
|
function getPlatform() {
|
||||||
@@ -86,7 +30,7 @@ function handleOpenTwakeMailApp() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function initialWorkerService() {
|
function initialTmailApp() {
|
||||||
const os = getPlatform();
|
const os = getPlatform();
|
||||||
const originInUrl = window.location;
|
const originInUrl = window.location;
|
||||||
|
|
||||||
@@ -94,7 +38,6 @@ function initialWorkerService() {
|
|||||||
|
|
||||||
// For desktop, we don't show the open on app popup
|
// For desktop, we don't show the open on app popup
|
||||||
if (os === otherPlatform || typeof window === 'undefined') {
|
if (os === otherPlatform || typeof window === 'undefined') {
|
||||||
fetchServiceWorker();
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user