aesthetic-startpage icon indicating copy to clipboard operation
aesthetic-startpage copied to clipboard

Refactor theme selection and preloading to avoid FOUC on theme change

Open lewisdoesstuff opened this issue 1 year ago • 3 comments

Hi!

I noticed that the demo page flickers unstyled content when changing the theme from the menu.

I've refactored the theme switching JS to preload all of the themes at page load instead of having the browser fetch them dynamically by switching the stylesheet ref.

Avoids the flash of unstyled HTML when clicking an option in the menu.

This may make first page load slightly slower, but shouldn't be an issue once the styles are cached.

lewisdoesstuff avatar Jan 03 '24 20:01 lewisdoesstuff

Deploy Preview for nainish-startpage ready!

Name Link
Latest commit 0ce794e61e18485b9cf68f460aa243b61ee8b823
Latest deploy log https://app.netlify.com/sites/nainish-startpage/deploys/6595c4812cc29700082b154d
Deploy Preview https://deploy-preview-92--nainish-startpage.netlify.app/
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] avatar Jan 03 '24 20:01 netlify[bot]

@lewisdoesstuff Hey I am testing this and will merge if all works fine

Nainish-Rai avatar Jan 04 '24 18:01 Nainish-Rai

Did this work okay @Nainish-Rai ?

lewisdoesstuff avatar Jun 14 '24 15:06 lewisdoesstuff

@lewisdoesstuff Yess, thanks for the PR

Nainish-Rai avatar Aug 13 '24 20:08 Nainish-Rai