News for hackers. Stuff that matters.
Re:Writing Less Code by jordanlev on Wednesday August 17, 2016 @03:36PM (#12307680)
This is the idea behind the new-ish "shadow dom" feature that is slowly being implemented by browsers. (Part of the larger "web components" concept that will hopefully become a thing at some point).

In the meantime... with some discipline you can keep things self-contained just by using unique classes for each component (like what BEM and other similar naming conventions espouse). Could also look into CSS linters to keep you and your team honest.

Re:Writing Less Code by welanes on Wednesday August 17, 2016 @04:51PM (#12308359)
> will hopefully become a thing at some point.

I replied to the parent comment here - https://news.ycombinator.com/item?id=12308352. You might find it useful.

Re:Writing Less Code by jordanlev on Wednesday August 17, 2016 @05:08PM (#12308485)
Thanks for the pointer. I'm actually a big fan of Vue.js and use it in several product sites/apps. However, if one is just wanting some componentization/isolation in their CSS and not actually building a javascript app, then it's kind of overkill. Also, while it does allow you to keep your component code in different files, by the time the browser is using your CSS it's still all in one big "global namespace" (so to speak), so you still need to enforce some discipline on your css class names, even if they're in different files. (Or perhaps I'm wrong about this and vueify modifies your classes or selectors or something to avoid this?)
Re:Writing Less Code by welanes on Wednesday August 17, 2016 @05:18PM (#12308553)
Sure, this is more for cases where you want to create reusable components. Which, if you work on multiple projects, might be often.

Yep, it renames them - https://github.com/vuejs/vueify#scoped-css