9 ms·
Highlighting My Code Based on How Much I Care
- silentmafia 1mo agoi like the idea, is there a theme we can download?
- tefkah 1mo agoi’m surprise by how much i liked that! also: neutrality website, very tasteful
- WhyIsItAlwaysHN 1mo agoThe 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
- burticlies 1mo agoI 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.
- commandersaki 1mo agoI use the default neovim theme and I feel that's essentially what I get out of it. Feels like sometimes I don't have highlighting enabled.
- weinzierl 1mo agoWhat about comments? Do you prefer comments to stand out or stand back?
- polyterative 1mo agoI prefer mine to have low emphasis because sometimes comments lie
- wittachai 1mo ago[dead]
- KronisLV 1mo agoCool 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.
- applfanboysbgon 1mo agoI 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.
- atiedebee 1mo agoThe article touches upon this: > Unlike prose, where you usually read it linearly, with code you bounce around based on what connected elements you are exploring. The moment you are jumping around a lot while reading, being able to understand the structure quickly becomes a major help. For example, dictionaries will have the words in a bold font while italicizing things like the plural etc.
- applfanboysbgon 1mo agoThe punctuation/indentation already give you structure, all the highlighting does is break up the flow of actually reading. It essentially forces a micro-reset every second or third word rather than allowing you to seamlessly scan to find what you're looking for. It looks unreadable on the blog post because they have an unreadable font that is way too spacey (nothing against pixel fonts, just their particular choice of one...), but it really is way easier to read code if you try no highlighting with a real font. I will caveat this on the fact that I use Allman brackets, and have even stronger opinions about that. K&R brackets are cancer and completely destroy the structure of code, so maybe that's why some people feel highlighting is necessary for "structure". With allman brackets, the punctuation guides your eyes to the indentation forming a clean box around each level of code, while if you draw a line from the opening bracket to the closing bracket with K&R style, half the code will be inside it and half outside it, bisecting the natural structure.
- sph 1mo agoI 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/environment.zig 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.)
- embedding-shape 1mo ago> 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 want the same as you, but probably also the same as you; I'm too lazy to do it myself. Maybe do all of us an favor, and create that yourself and share it with us? I too prefer no syntax highlight than bad one, and most out there are bad, and you clearly grok a bit more than the typical color scheme creator/maintainer, so you're already 50% there! ;)
- sph 1mo agoI have a crappy Emacs theme I built myself, inspired by Jon Blow's Emacs theme he uses on his stream which I find very peaceful to look at, but with a more bluish/indigo hue. It's full of bugs, so not comfortable sharing honestly, but I think it's worth spending an afternoon creating your own
- cauliflower99 1mo agoReally enjoyable read - well done! I wonder where else we could use an effective, minimal approach that solves the problem at first principles?
- nelsonfigueroa 1mo agoI 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 ;)
- Valodim 1mo agoGood 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".
- Lindby 1mo agoI totally agree with you about the comments. Code is so much easier to grok. The comments are there as a reference that you can concentrate on if the code doesn't make sense to you.
- econ 1mo agoI switch if the code is very ugly and unreadable. Often overly optimized things. One jumps to mind when I rewrote something to generate regexes.
- adamtaylor_13 1mo agoIf they're not scannable, there's a good chance they're too dense and should be rewritten.
- epolanski 1mo ago> 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.
- dainank 1mo agoMaybe I missed it but has he posted his theme anywhere (I assume for VSCode since he mentioned he is using that)?
- pasc1878 1mo agoI 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.
- econ 1mo agoI thought about nesting level coloring but had never seen it in action. I just look at it and it indeed looks nice. I thought it would be interesting as it separates that what repeats a task from the actual work being done on it. More nesting suggests more complexity. In my experiments I notice different ways to write something look better with different kinds of highlighting. If you for example use no highlights dividing the logic over tiny functions looks quite readable. In one experiment I use dark colors on a black background with only the comments in bright white. I wrote a lot more comments using that. Everything had a description and I could gaze over it as if the code wasn't there.
- nchmy 1mo agoYeah, it's just offensive to look at. Makes it significantly less likely that the author has useful things to say about font, highlighting etc. Not gonna bother finding out
- noxss 1mo agoIn 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
- vova_hn2 1mo agoSorry, 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. [0] https://tonsky.me/blog/syntax-highlighting/ https://tonsky.me/blog/syntax-highlighting/
- jdiff 1mo agoOf course it's a made up problem, most ultimately are. Programming (and life) are full of bike sheds for those with eyes to see them, does that mean they should not be painted?
- 0xjei 1mo agolovely 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/ https://diffs.com/)!
- wzdd 1mo agoThese 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.
- FridgeSeal 1mo agoI 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.
- cainxinth 1mo agoSomewhat related, I’ve long wanted an ereader app that color coded the characters in a novel.
- nrabulinski 1mo ago> 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.
- NoboruWataya 1mo ago> Just like I can’t remember the code to my apartment building, yet I type it in multiple times every day. To me it's even less problematic than this. Not being able to remember important codes except via muscle memory is quite unsettling for me because every now and again my muscle memory fails. Like I will get to an ATM and think "wait - what is my PIN?". With syntax highlighting, even if my muscle memory fails me I still benefit from syntax highlighting (I think). Because I can immediately see the structure of each line. If I am looking through code for a particular thing, I will probably be able to disregard entire lines because they obviously don't have the structure I am looking for. And even within a line, I can just look at the beginning of each "span", immediately know if it's what I'm looking for, and skip to the next span if it's not.
- setopt 1mo ago> Like I will get to an ATM and think "wait - what is my PIN?". Apple also has this stupid thing where you sometimes have to type your iPhone pin on your Mac to verify your identity. I’m unable to recall it on a keyboard instead of a keypad.
- setopt 1mo ago> have learned them over the years Well I guess that’s the difference? I personally change themes many times per day depending on my mood and the lighting conditions, and probably go through at least a few dozen themes in a year. I don’t need to memorize colors either though, I look for differences in colors not absolute colors.
- orphereus 1mo agoI 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.
- andai 1mo agoI enjoyed it. The italic pixels feel like some kind of crime though.
- monokai_nl 1mo ago> 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?
- mattlondon 1mo agoHmm 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.
- aos 1mo agoI 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. https://github.com/aos/vim-ascetic https://github.com/aos/vim-ascetic
- rfgplk 1mo agoI like the styling of the blog, but the font is actually very hard on the eyes.
- a2ff6eeb0 1mo agoHow many people here are still reading code?
- meerita 1mo agoI became fan of Tsoding Emacs theme. I like how subtle his colors are used to highlight parts of the code.
- jasonjmcghee 1mo ago(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
- shay_ker 1mo agoi'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.
- alembic_fumes 1mo agoI did somewhen toy with the idea of comparing how a line of code is written to what an LLM-based next-token-prediction would emit for the same line. Then it might be possible to highlight the pieces of code that most differ from what an LLM would have written. The base form isn't too useful by itself, but I expect if one would "seed" the LLM with a prompt about focusing specifically on a particular class of errors, it might be possible to find violations by seeing where the code completely deviates from what an LLM would have written. Never got around to doing anything with this, but I expect a prototype should take no more than a day with some agent-assisted coding ;) Tell me how it went if you try!
- 3371 1mo agoThis makes we wonder if anyone have tried to track attention to code with eye tracker
- twitchard 1mo agoIf 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?
- theokrueger 1mo agoone time i made a nlp-based syntax highlighter for english ebooks, and it was pretty interesting. in using it, i believe that it's a little handholdy and reduces expression when every word has some color based on it's part of speech. intentional application of this would be incredibly fun to read, if not incredibly tedious to write
- WorldMaker 1mo agoI saw a dyslexic/speed reading app that did something like this once. I don't know how useful that was in practice, but the theory of it was pretty compelling. Most sight reading is based on the overall shape of the word (rather than the component letters, we rarely actually read letter at a time [0]), and for different reasons word shape alone is still to slow for dyslexic and speed readers, so adding an extra channel of color can help speed up reading for both audiences of reader. [0] Which is why UPPERCASE TEXT is a reading speed bump for almost all readers because word shapes blur together into "just rectangles" more. Which is also why the "slow reveal" pattern in most visual novel genres is often very wrong for English text. (Most simply reveal character at a time which makes sense for CJK ideograms because one character is at least a full syllable if not also a full word. When the pattern was copied to English translations it probably should have been done word at a time rather than character at a time.)
- PlunderBunny 1mo agoIn a shared source, I wonder if it would be useful to make a theme that used brighter colours for segments of code that were more ‘contentious’, I.e. had a lot of changes? I guess it doesn’t work because a lot of contentious code is re-written (deleted and re-created). Or maybe newer code could be brighter, and older code (not touched for a long time) could fade?
- theturtlemoves 1mo agoBlue Yes I think much of the usefulness of syntax highlighting is a matter of having gotten used to a specific editor. Long time Visual Studio user, I tried VSCode and Jetbrains but for C# I switched back to good old VS. I know the pattern, the cadence, by now. Much like QWERTY keyboards, I'm not learning DVORAK now, my workflow is fine this way. Tried F#, but I'm sticking with C#. It's not that I believe the rational arguments don't hold up, I do see possibilities for productivity gain with each. But there's the retraining curve and that also factors in for me