Improve settings loading strategy by loading CSS and JS at the same time to prevent the style to be applied afterwards on slow connections
This commit is contained in:
parent
12d3f107c1
commit
87b6326d67
@ -303,6 +303,9 @@ function loadCss(cssFileName) {
|
|||||||
|
|
||||||
getSettingsButton().onclick = event => {
|
getSettingsButton().onclick = event => {
|
||||||
event.preventDefault();
|
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);
|
loadScript(window.settingsJS);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -3,7 +3,7 @@
|
|||||||
/* eslint prefer-const: "error" */
|
/* eslint prefer-const: "error" */
|
||||||
/* eslint prefer-arrow-callback: "error" */
|
/* eslint prefer-arrow-callback: "error" */
|
||||||
// Local js definitions:
|
// Local js definitions:
|
||||||
/* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme, loadCss */
|
/* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme */
|
||||||
/* global addClass, removeClass, onEach, onEachLazy, NOT_DISPLAYED_ID */
|
/* global addClass, removeClass, onEach, onEachLazy, NOT_DISPLAYED_ID */
|
||||||
/* global MAIN_ID, getVar, getSettingsButton, switchDisplayedElement, getNotDisplayedElem */
|
/* global MAIN_ID, getVar, getSettingsButton, switchDisplayedElement, getNotDisplayedElem */
|
||||||
|
|
||||||
@ -207,9 +207,6 @@
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
// First, we add the settings.css file.
|
|
||||||
loadCss("settings");
|
|
||||||
|
|
||||||
// Then we build the DOM.
|
// Then we build the DOM.
|
||||||
const el = document.createElement("section");
|
const el = document.createElement("section");
|
||||||
el.id = "settings";
|
el.id = "settings";
|
||||||
|
Loading…
Reference in New Issue
Block a user