惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
T
Tailwind CSS Blog
J
Java Code Geeks
Microsoft Azure Blog
Microsoft Azure Blog
GbyAI
GbyAI
爱范儿
爱范儿
量子位
Martin Fowler
Martin Fowler
V
V2EX
博客园 - 三生石上(FineUI控件)
I
InfoQ
MongoDB | Blog
MongoDB | Blog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
N
Netflix TechBlog - Medium
D
DataBreaches.Net
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Last Week in AI
Last Week in AI
U
Unit 42
Apple Machine Learning Research
Apple Machine Learning Research
H
Help Net Security
T
The Blog of Author Tim Ferriss
Hugging Face - Blog
Hugging Face - Blog
美团技术团队
Engineering at Meta
Engineering at Meta

Red Blob Games: latest blog posts

Red Blob Games: English: a vs an Red Blob Games: Differential heuristics Red Blob Games: Responsive design calculator Red Blob Games: Academic citations Red Blob Games: Highlighting interactive code blocks Red Blob Games: Optimizing page size Red Blob Games: Writing a guide to SDF fonts Red Blob Games: URLs with trailing punctuation Red Blob Games: What I did in 2025 Goodbye Sass Red Blob Games: RotMG map seeds Red Blob Games: Mapgen4 Mapgen4's use of WebGL2 Red Blob Games: Mapgen4 river shader Red Blob Games: Mapgen4 renderer Red Blob Games: Harnessing ChatGPT hallucinations Red Blob Games: Let Let's write a search engine, part 2 of 2 Red Blob Games: Let Let's write a search engine, part 1 of 2 Red Blob Games: Hexagon conversions Red Blob Games: Mapgen4 trade routes Red Blob Games: De-optimizing mapgen4 Red Blob Games: Hexagon spiral coordinates Red Blob Games: Thoughts on Flash Red Blob Games: What I did in 2024 Red Blob Games: Hexagon page animations Red Blob Games: SDF Halos SDF Halos Red Blob Games: SDF headless tests, part 2
Red Blob Games: Goodbye Sass
2025-12-28 · via Red Blob Games: latest blog posts

My “site” is spread across five different servers. I use slightly different CSS on each one. Since 2013 I’ve been using Sass (SCSS) to manage the variants, using these features:

  1. Variables → available in CSS since 2020
  2. Calculations → available in CSS since 2015
  3. Nesting → available in CSS since late 2023

Even though I want to use new browser features right away, I usually wait a year or two for them to stabilize and get into extended support releases.

A few years ago I had switched variables and calculations from Sass to CSS, but I still needed Sass for nesting. Since CSS nesting has now been supported for two years, I decided it should be safe for me to use it. And that means I no longer need Sass.

I divided the CSS into eight files that I can simply concatenate together (using cat), then esbuild[1] to minify the result:

cat input1.css input2.css … \
  | esbuild --loader=css --minify --bundle --external:* \
            --outfile=output1.css

Since the web server uses gzip content encoding[2], does it really matter if I minify? Yes, it does, and the help from minify seems to be independent of the help from gzip:

Size reduction file when using gzip or minify

The main goal of this change was to reduce dependencies. But it looks like I still have a dependency on esbuild instead of on sassc. How is that better?

I have been maintaining my site for over 30 years. It’s older than Wikipedia or Google. Most software doesn’t last that long, and I don’t expect sassc or esbuild to last as long as my web site. When I’m choosing tools I ask myself “what happens when this software disappears?”

There’s a difference between the sassc risk and the esbuild risk. I’m using sassc to translate Sass to CSS. If it disappears (it’s already deprecated[3]), I have to manually translate it, or find an alternative. I can’t update the site without that software. I’m using esbuild only to minify. If it disappears, I lose an optimization but I don’t have to do more work. I can continue updating the site without it. So in terms of dependencies I’m happier with esbuild than sassc.

I generally want to prioritize changes that make the site better for readers. This change does not help in the short term. But years from now, when I want to fix a typo or add information to the site, it will be easier for me to update if I have fewer dependencies to update. Everything is about tradeoffs. Not using a useful tool can make things harder, but using a useful tool can make things harder in a different way.