Skip to content

Added page loader to prevent page loading artifacts on slow connections

Francesco Cattoni requested to merge loading-screen into master

An eagerly-loaded page loader screen was added to cover the Reveal.js loading artifacts during page load while using slow connections.

All the CSS resources are separate from the main stylesheet to allow for prioritized synchronous loading.

After Reveal.js initialize() call completes, the screen fades out with a 1s transition after which it gets removed completely. Only the stylesheet link is left loaded to prevent unnecessary repainting.

As a quick way to style the loader a safe check to localStorage was added. You just need to add debug-loader as true in the application tab of the browser dev tools (or execute localStorage.setItem('debug-loader', 'true'); location.reload() from the JS console of the loaded presentation) and the loader won't be removed automatically anymore.

Edited by Francesco Cattoni

Merge request reports

Loading