home ~ projects ~ socials

Make A Dark/Light Mode Color Switcher That Doesn't Cause A Flash Of Unstyled Content With Vanilla JavaScript

Notes

  • There can be a "The resource at 'URL' preloaded with link preload was not used within a few secionds. Make sure all attributes of the preload tag are set correct." - TODO: Look to see if there's something better than preload to use.
  • DOMContentLoaded does not wait for stylesheets to load, however deferred scripts do wait for stylesheets, and the DOMContentLoaded event is queued after deferred scripts. Also, scripts which aren't deferred or async (e.g.

  • I haven't tried using rel="preload". I was already down my path before I remembered it exists.
  • I didn't try the attribute
  • Note that the code checks to see if the system is sending info and only shows a "system" option if there's something to support it.
  • Mention color-scheme and switching it so form controls update.
-- end of line --

References