Implementing Dark Mode without the Flash of Light Mode (FOUC)
How to read cookies in Next.js layout and inject script tags before the browser paints the body element.
Flashing layouts during page load degrades user experiences. Reading cookies inside Layout components allows servers to pre-configure theme class markers.
We detail using inline scripting blocks to parse configurations and toggle appropriate classes before the DOM elements render.