Library vision and roadmap

[itsdouges]

Elevator pitch

(1) Compiled brings platform and product closer, enabling delivery of highly performant component libraries through NPM which products can consume without needing to configure their build tooling. Import and go!

(2) All behavior available in common runtime solutions are available, such as conditional CSS, style composition, and APIs. Don't change a thing!

(3) Products can style their app using Compiled and opt into advanced performance optimizations, such as extracting all found styles to a single atomic stylesheet. Extract all styles!

Roadmap

There isn't always one way to get to a destination, and Compiled is no different. Here are some things we've done, will do, and want to do, in the future.

Completed

Features you can use today after installing Compiled!

• CSS prop
• Styled component
• ClassNames component
• Property static evaluation
• CSS function static evaluation
• Module boundary static evaluation
• Atomic CSS
• Dynamic declarations
• CSP support
• SSR support
• Testing support
• CLI & codemods
• Babel plugin compiler
• Webpack loader Webpack loader #530
• Parcel transformer Parcel transformer spike #512
• Webpack CSS extraction RFC: CSS extraction #58

Soon

Features we're working on in the short term. But it doesn't mean they'll be finished soon!

• Critical bug fixes
• CSS mixin CSS mixin api #313
• Keyframes RFC: Keyframes api  #14

Later

Features we're interested in working on but won't be working on them soon. This is an unordered list.

• Parcel CSS extraction
• Static evaluation bug fixes
• Conditional ternary CSS rules Conditional ternary CSS rules #389
• Conditional CSS rules for styled Conditional CSS rules for styled #390
• Conditional CSS rules for class names Conditional CSS rules for ClassNames #391
• Function body static evaluation Evaluate static body expressions #510
• Global component Global styles component #62
• Theming RFC: Theming #18
• Static style analysis RFC: Static style analysis #132
• Class name hash reduction RFC: Compress atomic class names during CSS extraction #335
• Styled function mixin CSS mixin api #313
• Strict styling RFC: Strict mode #182