Chris Smith Exchanges Sass for Native CSS
There was a time when Sass was a critical part of my web development toolset. The extension treats CSS — the language used to impart visual style and layout to websites — like an actual programming language replete with variables and functions and whatnot, which makes it incredibly easy to write and manage a website’s styles.
But as CSS has continued to grow and mature, and include features like variables and code nesting, I’ve found myself using Sass less and less. And I’m not the only one. UK-based web developer Chris Smith has written a step-by-step guide to migrating from Sass to native CSS (via TLDR Dev), and the benefits of doing so.
For years Sass offered us superpowers. It was a superset of CSS, opening up a world of possibilities for developers. The ability to use variables, functions and nest our rules was too good to turn down.
Today we have all of this in native CSS. It caught up. So, unless you’re doing something very particular, Sass just isn’t needed anymore.
The only advice of his that I’m a little leery about concerns imports. I do still find Sass useful for managing really large projects, like design frameworks, that have lots of little components (e.g., badges, buttons, cards, form controls). I typically have a small Sass file for each component, which keeps the code nice and manageable. While Smith is technically correct that you could just include each one of those as its own CSS file (e.g., badges.css, buttons.css), it feels a little yucky and disorganized to see a bunch of <link> tags in a website <head>.
I’ll admit there’s some personal programming preferences at work here. It just feels cleaner to see a single site.css file in the <head> instead of lots of little ones. (Or, if you’re practicing critical CSS, a single site.css file alongside a single <style> tag.) It feels cleaner for all of the messy code organization — e.g., managing the cascade and which styles come before other styles — to happen behind the scenes via Sass. But again, these are personal preferences, not technical requirements, so your mileage may vary.
All that said, I’m glad to see more and more developers like Smith embrace the power and flexibility of modern CSS, which continues to improve every year, with still more promising features on the horizon, like native mixins.