alt Hacker NewsHighlighting My Code Based on How Much I Care
Comments
I am convinced everybody gets syntax highlighting wrong and this article backs me up.
My pet peeves:
- I have no idea how people are supposed to be productive with non-semantic rainbow vomit themes that are so popular in modern editors. I'm too ADHD to want to be overly stimulated by useless information.
- I routinely hate encountering Zig code on Github, where the theme they use turns everything brown. Oh it's because it's a struct member. Dude, everything is a struct member in Zig, it's silly to allocate a vibrant colour for what amounts to 90% of the source code. Random example off my browser history: https://github.com/foxnne/aftersun/blob/main/src/time/enviro...
- Yesterday I opened some Lisp code in KDE's KWrite text editor, and every single default theme highlights parens with a bold font + vibrant colour to make them stand out. Parens in Lisp are supposed to fade in the background, not pop in your face. It was completely unusable, I had to turn off syntax highlighting.
Always seeking good, minimal, muted colour themes for my editors. I wish we had serious designers to design themes for usability and comfort, and not people that have no business playing with colours.
I remember a colleague that used to write code with syntax highlighting off, and thought that was an eccentric choice. The older I get, the more I appreciate his wisdom. I'd rather have no syntax highlighting than bad one; at least one would try to make the code easy to parse by its structure alone (shorter lines, comments to delimit sections, etc.)
If rule-based highlighting of syntax is meaningfully helpful for reading code then how come nobody uses rule-based syntax highlighting of prose?
Why don't we visually emphasize the verb in a sentence and deemphasize articles and prepositions, for example?
In prose the author can *bold* or italicize text to emphasize ad-hoc, or make ## headings for scanning. Why can't we do such ad-hoc emphases in code?
These rethinking-highlighting posts always start out with the wrong premise. The color for class names in my code is the color all the class names have. After a short time working with the code I would notice if one looked off. The brain is really very efficient. You don’t optimise for random out of context recall unless you really try hard to do so. It says nothing about the efficacy of the scheme.
Hmm this wasn't quite what I expected.
I thought that this might be some sort of highlight based on complexity/risk/importance. That immediately struck me as a "why didn't I think of that?!" moment when actually turns out they didn't either.
So I can imagine a scenario where you have a LLM agent's diff to review while iterating in an IDE. The diff would highlighted according to importance/complexity for human review. Trivia like getters and setters would be grey. Highly complex or complicated or risky code would be highlighted in some high-contrast bold colour (perhaps with a luminance scale depending on how critical it was). Then when you are reviewing the diff from the agent you can instantly see and focus on the most important bits that need the most attention.
I'd find that really useful.
I couldn’t tell you what colour my functions or structure syntax is, but I can tell you when I look at code, that the presence of the colour instantly lets me straight to whatever part of the text I care about at that moment.
In my case, colors matter because they help me read faster the keywords of a language that define algorithms such as conditionals, loops, beginnings and ends of functions, returns... without color it is more difficult to send the eye to the correct position. Perhaps it's due to habit or visual memory?
Good article that gives you food for thought
I like the styling of the blog, but the font is actually very hard on the eyes.
I found this site very difficult to read and I had to give up as it was hurting – the font is unreadable.
As for syntax highlighting – I don't like it either.
I use themes that change colour according to their nesting level.
I like highlighting only the language concepts:
Reserved words are red
Strings are green
Constants/numbers are blue
Types/meta-language are yellow
Anything else is white.
It’s not too colorful but still gives you plenty of anchors for your eyes.
(If it's not just for reading / presentation and you're actually working with the code)
using underlining / background color as part of syntax highlighting will conflict with LSP/IDE diagnostics unless their presentation is redone as well. many editors don't provide that control
I decided a few years back to forego color all-together in my syntax highlighting because it was always more distracting than helpful.
I built this monochrome and low-contrast simple colorscheme for vim and I’ve been using it since. Haven’t missed colors at all.
This makes we wonder if anyone have tried to track attention to code with eye tracker
I get the theme of the site is inspired by retro games, but the font makes it so hard to read the article, I had to give up. Too bad, since I like the concept of a retro game theme.
i'm actually curious if anyone has explored syntax highlighting with ML. doesn't have to be an LLM, but something that actually highlights what's interesting, or even strange, about a code snippet.
I became fan of Tsoding Emacs theme. I like how subtle his colors are used to highlight parts of the code.
I went through a similar journey not too long ago. I also asked myself "Why does highlighting even need to be in color?" when reworking my blog. I wanted a monochromatic look for my entire site, including code blocks. I noticed code blocks are still very readable as long as there's different tones. I still like pretty colors so I compromised by doing normal syntax highlighting when a code block is hovered over (or tapped on mobile).
Btw the dynamic highlighting by clicking on the code is so cool. I may or may not steal that idea ;)
Cool article, really cool website (the font could also be a bit smaller, if it didn't mess with the fidelity), but the grayscale setup just doesn’t have enough contrast for my eyes to reliably pick up on it at a glance.
Good article, enjoyed it. I might give this idea a shot!
> Comments: these contain high level descriptions (faster than reading the code) and external context (the “why” that reading code can’t answer). This is the most scannable thing in any big code file.
Not sure about that one, depending on comment culture. Comments are prose and not structured, so to understand their meaning is a lot more cognitive load for me than (most) code. I certainly wouldn't have thought to call them "scannable".
Maybe I missed it but has he posted his theme anywhere (I assume for VSCode since he mentioned he is using that)?
Somewhat related, I’ve long wanted an ereader app that color coded the characters in a novel.
The continue keyword is also important, or alternatively the condition to run it.
I often fail to notice it on the first look of some snippet of code
lovely takes! even if the percentage of techies who reads & codes effectively outside coding agents is way way smaller; I think it would be cool to apply this for reading diffs! there might be some adjustments but, I might end up trying to apply principles on top of diffs (https://diffs.com/)!
Really enjoyable read - well done! I wonder where else we could use an effective, minimal approach that solves the problem at first principles?
Sorry, but I think that this is a completely made up problem. I've checked out the referenced Tonsky's article [0] and for me "colorful" examples are much easier to read than his suggested alternative.
Also, I had to use reader view for TFA because of this silly pixelated font. Ironic, considering that the article is about readability.
> Here’s another test. Close your eyes (not yet! Finish this sentence first) and try to remember what color your color theme uses for class names? Can you?
Yeah. Pink for keywords, orange for arguments, yellow for strings, green for functions, blue for classes and purple for constants.
But it’s not even important if you can. Having different colors helps you quickly / unconsciously filter through different parts of your code. I agree it can be too distracting to have lots of colors (especially with semantic highlighting, which I’m no particular fan of for that reason), but a carefully calibrated theme helps most people I think.
I can also certainly imagine that some brains just work differently. Maybe for some people colors just add more noise?
How many people here are still reading code?
i like the idea, is there a theme we can download?
i’m surprise by how much i liked that! also: neutrality website, very tasteful
> Why does highlighting even need to be in color?
I wrote a vscode extension for effect-ts authoring that indeed leverages this concept.
It adds underlines and/or bolder fonts to emphasize different functionality.
I will always yap to anyone who will listen that I think syntax highlighting was a mistake that has cost humanity untold millions of productivity hours. I only highlight comments to distinguish code from not-code, I think everything else is a pretty distraction. Note how nobody ever got the idea to apply syntax highlighting to English or any other natural language, whether in books or on forums. I could believe syntax highlighting helps learn to distinguish things when you're new to programming, but for experienced readers syntax parsing happens as automatically as it does in natural language without any need of colors.
> try to remember what color your color theme uses for class names?
While I overall agree with the point of this post and the post being cited, I disagree with the premise that you need to be able to actively recall facts like this. The theme I personally use is quite toned down, but it does use different colors for variables, keywords, arguments, type names, and a few other classes of tokens. I don’t consciously think “hmm, what color is an argument” to look for those in my code - I just see them, have learned them over the years, and it’s muscle memory at this point, and helps me read the code. Just like I can’t remember the code to my apartment building, yet I type it in multiple times every day.