3 ms·
"Nesting in Sass should be avoided" Aren't you missing the best feature of using SASS in the first place? It's a joy to create highly targeted styles with pro
by eriktrautman 12y ago
"Nesting in Sass should be avoided"
Aren't you missing the best feature of using SASS in the first place? It's a joy to create highly targeted styles with proper SASS nesting... why is it to be avoided?
- nroman 12y agoIf you do in SASS .Foo { a { /* stuff */ } } It translates into: .Foo a { /* stuff */ } CSS is evaluated right to left, so this means every time an <a> is encountered in the page it has to at its parent chain to see if any has class Foo. This can cause performance issues especially for really large pages. That said, for most pages it won't make a noticeable difference so it's kind of up to you to decide if you care.
- eriktrautman 12y agoWhat's the more performant/"proper" way to narrowly target CSS in that situation? Just tacking classes directly on the links (e.g. `<a href="#" class="foo-link">` starts to get very cluttered very fast if you want the benefits of deeper nesting, targeting and namespacing (e.g. `<a href="#" class="foo-bar-baz-link">`. Is it best to simply try to avoid nesting of styles altogether and keep namespaces as flat as possible?