facebook / facebook/docusaurus

Re-introduce CSS code splitting

オープン
#6,228 コメント 1 件 リアクション 0 件 担当者 0 名 GitHub で見る
domain: performance proposal
主要言語
TypeScript
スター
66.2k
フォーク
10k
平均マージ
1日 3時間
マージ済み PR(30日)
52

説明

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#reporting-new-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: https://github.com/facebook/docusaurus/issues/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.

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。