Show HN: I made a heatmap diff viewer for code reviews
0github.com0github.com is a pull request viewer that color-codes every diff line/token by how much human attention it probably needs. Unlike PR-review bots, we try to flag not just by "is it a bug?" but by "is it worth a second look?" (examples: hard-coded secret, weird crypto mode, gnarly logic, ugly code).
To try it, replace github.com with 0github.com in any pull-request URL. Under the hood, we split the PR into individual files, and for each file, we ask an LLM to annotate each line with a data structure that we parse into a colored heatmap.
Examples:
https://0github.com/manaflow-ai/cmux/pull/666
https://0github.com/stack-auth/stack-auth/pull/988
https://0github.com/tinygrad/tinygrad/pull/12995
https://0github.com/simonw/datasette/pull/2548
Notice how all the example links have a 0 prepended before github.com. This navigates you to our custom diff viewer where we handle the same URL path parameters as github.com. Darker yellows indicate that an area might require more investigation. Hover on the highlights to see the LLM's explanation. There's also a slider on the top left to adjust the "should review" threshold.
Repo (MIT license): https://github.com/manaflow-ai/cmux
This is very cool and I could see it being really useful especially for those giant PRs. I'd prefer it if instead of the slider I could just click the different heatmap colors and if they indicated what exactly they were for (label not threshold). I get the underlying premise but at a glance it's more to process unless I was to end up using this constantly.
Currently tooltips are shown when hovering on highlighted words. Need to make it visible on mobile though. Was wondering if you were thinking of another way to show the labels besides hovering?
This is something I have found missing in my current workflow when reviewing PR's. Particularly in the age of large AI generated PR's.
I think most reviewers do this to some degree by looking at points of interest. It'd be cool if this could look at your prior reviews and try to learn your style.
Is this the correct commit to look at? https://github.com/manaflow-ai/cmux/commit/661ea617d7b1fd392...
https://github.com/manaflow-ai/cmux/blob/main/apps/www/lib/s...
This file has most of the logic, the commit you linked to has a bunch of other experiments.
> look at your prior reviews and try to learn your style.
We're really interested in this direction too of maybe setting up a DSPy system to automatically fit reviews to your preferences
Thank you. This is a pretty cool feature that is just scratching the surface of a deep need, so keep at it.
Another perspective where this exact feature would be useful is in security review.
For example - there are many static security analyzers that look for patterns, and they're useful when you break a clearly predefined rule that is well known.
However, there are situations that static tools miss, but a highlight tool like this could help bring a reviewer's eyes to a high risk "area". I.e. scrutinize this code more because it deals with user input information and there is the chance of SQL injection here, etc.
I think that would be very useful as well.
This is a very interesting idea that we’ll definitely look into.
I like the idea!
File `apps/client/electron/main/proxy-routing.ts` line 63
Adding a comment to explain why the downgrade is done would have resulted in not raising the issue?
Also two suggestions on the UI
- anchors on lines
- anchors on files and ability to copy a filename easily
This is really useful. Might want to add a checkbox at a certain threshold, so that reviewers explicitly answer the concerns of the LLM. Also you can start collecting stats on how "easy to review" PR's of team members are, e.g. they'd probably get a better score if they address the concerns in the comments already.
I feel like this is really smart. Going to have to set it up!
I think this "'should review' threshold" is a really great idea, but I probably wouldn't be able to trust it enough to make it useful.
This makes reading long PRs not instantly LGTM… now the heatmap guides my eyes so I know where to look.
Reminds me of this one, highlighting for text https://github.com/mattneary/salience