1
Fork 0

Rollup merge of #96741 - GuillaumeGomez:improve-settings-loading-strategy, r=jsha

Improve settings loading strategy

I learned about this thanks to ```@jsha``` who suggested this approach:

It improves the settings loading strategy by loading CSS and JS at the same time to prevent the style to be applied afterwards on slow connections.

r? ```@jsha```
This commit is contained in:
Michael Goulet 2022-05-05 19:34:25 -07:00 committed by GitHub
commit 7cdad77536
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 4 deletions

View file

@ -303,6 +303,9 @@ function loadCss(cssFileName) {
getSettingsButton().onclick = event => {
addClass(getSettingsButton(), "rotate");
event.preventDefault();
// Sending request for the CSS and the JS files at the same time so it will
// hopefully be loaded when the JS will generate the settings content.
loadCss("settings");
loadScript(window.settingsJS);
};

View file

@ -3,7 +3,7 @@
/* eslint prefer-const: "error" */
/* eslint prefer-arrow-callback: "error" */
// Local js definitions:
/* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme, loadCss */
/* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme */
/* global addClass, removeClass, onEach, onEachLazy, NOT_DISPLAYED_ID */
/* global MAIN_ID, getVar, getSettingsButton, switchDisplayedElement, getNotDisplayedElem */
@ -209,9 +209,6 @@
},
];
// First, we add the settings.css file.
loadCss("settings");
// Then we build the DOM.
const el = document.createElement("section");
el.id = "settings";