CODEWITHSUNDEEP
reactjsnext.jsserver-side-rendering
gullerg
gullerg

Reputation: 381

Removing server-side injected CSS

In this example of how to use Material UI with Next.js, they remove the server-side injected CSS when the component mounts in the browser. What's the advantage of that?

Upvotes: 7

Views: 1803

Answers (1)

Ramakay
Ramakay

Reputation: 3145

This is more of a CSS in JS construct when SSR is involved. Once the client is rehydrated it adds any new styles that are needed for that view, however any previously printed styles are not removed and they are simply removing them,

  1. User lands on Page A - SSR for Page A maybe rendered inline for performance purposes.
  2. User transitions to or moves to Page B, it has conflicting CSS from previous SSR rendering and may cause side effects or simply does not need the style object.

Upvotes: 5

Related Questions