Magma 2
Magma with a zero runtime flavour
Magma Podríamos crear un Magma 2 basándonos en la API de sprinkles de vanilla-extract, que sería algo parecido a Magma 1, que se basa en la API de styled-system
🍨 Vanilla-extract
Use TypeScript as your preprocessor. Write type‑safe, locally scoped classes, variables and themes, then generate static CSS files at build time.
Basically, it’s “CSS Modulesin-TypeScript” but with scoped CSS Variables and heaps more.
Vanilla extract encaja a la perfección con este modelo. Es parecido a CSS-IN-JS en cuanto a que se escriben los estilos en objetos de js, que se parsean a css en build time.
Para el theming hace uso de las custom properties de css, las cuales hashea para así hacelo totalmente local y evitar el clashing.
Tiene una API, sprinkles que es esencialmente como styled-system (en lo que realmente está basado Magma 1)
Pros
- Hecho por el creador de CSSModules.
- No es almost zero runtime, etc.., es ZERO runtime.
- Typescript ready (se puede usar javascript).
- Al soportar typescript se pueden crear una DX brutal el el editor haciendo uso del autocomplete para primitivas.
- Webpack, Esbuild, Vite, Next, Gatsby ready.
- Adopción de la comunidad brutal.
Contras
- Aunque mínima, tiene abstracción sobre vanilla css
- Estilos escritos en objetos javascript