This tool seems useful if you buy into the philosophy, but I'm just not sold yet - component based styling leads to a lot of style duplication and makes it very easy for a developer to go "off the playbook" when it comes to enforcing a consistent styleguide throughout an app.<p>The idea that "globals" in CSS are bad is counter intuitive to my experience that globals in CSS encourage consistency<p>Maybe when you're facebook size and you have many product teams all expected to produce something that all works together - I can see how the global namespace would be impossible to manage. For your average website or app? Not even close. It'll be awhile before you run into the limitations of CSS that Facebook is running into.
I'm not 100% what this is exactly... Care to clear it up a bit?<p>At first I though this is for those situations where you find yourself urged to modify the css in your javascript. But looking at the documentation, this seems to be a way to write the complete CSS in JS, and then to have it compiled into CSS. Do I understand that wrong? If not: Why would one want that?
The current state of the JS world is getting closer every day to the J2EE craziness about 10 years ago. As an outsider it was nearly impossible to understand for what all those frameworks with funky names were required at all. For an insider every of those new frameworks looked like the solution to a fundamental CS problem. However, those fundamental CS problems where nothing else then some shortcomings introduced by the latest framework before.
Wouldn't these two lines of code do the same thing?<p><pre><code> var addCSS = (css) => { window.document.styleSheets[0].insertRule(css, window.document.styleSheets[0].cssRules.length); };
addCSS('.x { color: red; width: 5px; }');
</code></pre>
Test examples (+ another version that can add multiple selectors in the same line): <a href="https://jsfiddle.net/xkLnj9st/" rel="nofollow">https://jsfiddle.net/xkLnj9st/</a>
Can somebody explain how this approach affects the style caching by the browser? It seems that this will just throw away all the caching optimizations built around that.
I'm a massive CSS-in-JS skeptic but this is a very nicely thought out low-level tool for that stack.<p>It's basically a JS version of SASS mixins (kinda).<p>Most of my objections to CSS-in-JS are they are all poorly architected high-level abstractions taking a bad solution to a lower level problem.<p>This feels like a good basis for a higher level tool that doesn't suck.<p>And like I said - I say that as someone broadly skeptical of the whole topic.
Mods: consider linking to the project homepage, <a href="https://polished.js.org/" rel="nofollow">https://polished.js.org/</a> which appears to give much more context
I'm coming around slowly but I still have a hard time with css being embedded in JS components. I have used SCSS for so long I am used to style and function being separate concerns and separate files. I like the idea of being able to use 'mixins' for js components.
Also interesting, for people who fear style duplication: <a href="http://styletron.js.org" rel="nofollow">http://styletron.js.org</a>
I found that the killer application for Javascript would be to write github repos for Javascript wrappers for typescript. Seriously, why is CSS as Javascript objects a thing? Are we so bored with the stack we've been using that we can only make things interesting by cross compiling everything? It makes me think of this video: <a href="https://www.destroyallsoftware.com/talks/the-birth-and-death-of-javascript" rel="nofollow">https://www.destroyallsoftware.com/talks/the-birth-and-death...</a>