Re-introduce CSS code splitting

[slorber]

Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Motivation

Currently, Docusaurus outputs a single big CSS file.

We do this because it's hard to code split CSS and do lazy loading properly without having nasty side-effects.

User navigation might change CSS insertion order leading to different rules being applied according to the current navigation history.

See reasons why we emit a single CSS file: #2006

It is a hard problem but we should figure out a way to solve it someday.

That seems reasonable that Infima and classic theme CSS is emitted as a single CSS file (it's hard to code split properly considering Infima is already quite monolithical)

But for custom site pages, we might be able to do something and emit separate lazy-loaded CSS files

The idea is that browsing a doc should not load CSS for the homepage, the showcase and other pages of a site

---

Interesting reads:

• https://www.coolcomputerclub.com/posts/importing-css/

Note: Remix also implements some nice system where CSS of a page is inserted when you navigate to a page and removed when you navigate away: https://remix.run/docs/en/v1/guides/styling

---

This is not something high priority, just something to keep in mind

Self-service

• I'd be willing to do some initial work on this proposal myself.