This isn't specifically to do with Styletron, but I'm wondering: what is the use case for building arbitrary CSS from JavaScript? I've never written an app where this seemed necessary; the most I've ever needed is some semantic classes to apply, like this:<p><pre><code> .request-pending {background-color: $yellow;}
.request-acknowledged {background-color: $green;}
</code></pre>
It seems like mixing the actual styles in with the JS violates separation of concerns and clutters up the actual logic.
I'm curious about this limitation:<p>> Descendant and child combinators are unsupported<p>Are conditional applications of rules also unsupported, like `:hover` and media queries? That's a big deal in terms of runtime perf, too.
Am I having a hard time understanding this CSS in JS concept, and therefore Styletron, if I've never worked with React before? Let's say at a basic level, I have compiled stylesheets -- could you explain in simple web developer layman's terms how this could be implemented, knowing the benefit of reduced file size and increased performance is what were aiming for?
Looks nice but I don't like the lack of pseudo selectors:<p>From the footnotes:<p>> The one area where this is useful is combining descendant combinators with pseudo classes, the most common use case being where hovering a parent triggers a style change in a descendant node. However, this behavior be implemented in JavaScript with event listeners and explicit state changes if needed.
tl;dr: deduplication processing for CSS speeds CSS compilation and produces smaller file sizes. Cool!<p>The article only has compilation performance tests, and there's a small mention in the docs: How does Styletron affect render speed in the browsers?<p>Also, what tool are you using to convert existing CSS to JS objects?
Sounds awesome.<p>I got the same idea, when I looked at javascript style sheets.<p>"We don't do inline styles, we generate classes!"<p>If they already generate, why not merge the whole stuff?