Does CSSOM block page rendering? Why?
sobes.tech AI
Answer from AI
CSSOM (CSS Object Model) is an object model that is created by the browser after parsing CSS. The rendering of the page depends on the combination of DOM and CSSOM into the render tree.
CSSOM does not block rendering directly, but the process of building CSSOM must be completed for the browser to construct the render tree and display the page. If CSS is loaded synchronously (for example, via <link rel="stylesheet"> in <head>), the browser pauses DOM construction and rendering until CSS is received and parsed to avoid FOUC (Flash of Unstyled Content).
Thus, CSSOM indirectly blocks rendering because the browser waits for the CSSOM to be built for correct style display. If CSS is loaded asynchronously or inline, rendering can start earlier but with a risk of incorrect display.
In summary: CSSOM itself is a model, but the process of building it affects rendering, blocking it until CSS parsing is complete.