callstack / callstack/linaria

Allow to force some of CSS rules for critical collection

Open
#219 2 comments 0 reactions 0 assignees View on GitHub
enhancement: proposal 💬 platform: ssr 🛠️ skip autolabeling
Dominant language
TypeScript
Stars
12.4k
Forks
413
PR merge metrics
No merged PRs in 30d

Description

### Introduction

Some users may want to selectively inline some of the non-critical CSS rules along with critical CSS. These rules, for example, may be used in timing-dependent manner, e.g. appear on page shortly after its loading, but they may not be present in initial server-rendered HTML.

### Design decisions

- The feature could be invoked either via regex or list of regexes of class names to include into `collect()`ed critical CSS.
- The feature could also be invoked using a "magic" `@atrule` directly in stylesheet source code.
- The feature could also be invoked using a "magic" comment in source code. However, this is much more problematic and error-prone, as intermediate preprocessors may strip comments.
- "Manually forced" CSS can be extracted into separate subset, additionally to now existing `critical` and other`.
- Probably too much, but user could even specify desired subsets (similar to webpack chunks), for example, prioritize CSS by its importance/probability to appear/timing.

---

Do you think it is something that Linaria can implement?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.