
Creo que acss.io es el primer uso de “Atomic CSS” donde el objetivo es ser un compilador. Escribes CSS así:
<div class="C(#333) P(20px)">
text
</div>
Y generará CSS como:
.C(#333) {
color: #333;
}
.P(20px) {
padding: 20px;
}
(O algo así.)
El caso es que solo genera el CSS que realmente necesitas, porque lo pediste, y nada más. El resultado es mucho menos CSS de lo que vería en una hoja de estilo promedio.
Ese proceso de compilación es lo que se conoce como CSS “Just in Time”.
El popular framework Tailwind lo soporta. Me da la vuelta al modelo mental de Tailwind. En lugar de proporcionar una gran cantidad de clases de utilidad CSS para usar, y luego “purgar” lo que no se usa, solo crea lo que necesita para empezar.
Yo diría que “Just in Time” es un concepto que se está poniendo de moda. Acabo de ver Assembler CSS y se inclina a lo grande. En lugar de clases, haces cosas como:
<div x-style="grid; gap:1rem; grid-rows:1; grid-cols:1; sm|grid-cols:3">
<button x-style="^button:red">Submit</button>
</div>
Estoy bastante desgarrado por estas cosas. A una parte de mí le gusta cómo puedes peinar sin tener que dejar tus plantillas. Y me gusta especialmente la salida de CSS extremadamente mínima, ya que CSS es un recurso de bloqueo. A otra parte de mí no le gusta que sea una abstracción limitada de CSS en sí, por lo que estás a merced de la herramienta para admitir cosas que CSS puede hacer de forma nativa. También hace que HTML sea un poco más difícil de ver, aunque ciertamente lo superé con los controladores de eventos en línea JSX y demás.