Show HN: GitHub style split diffs in your terminal | Hacker News Reader

Show HN: GitHub style split diffs in your terminal

github.com

178 pointsmilkbikis50 comments

I already use delta for this: https://github.com/dandavison/delta

I thought delta was fairly well-known by now so I was surprised to see this project not mention it (the readme already has a section for that). I wonder what they've chosen to do differently, besides write it in Node.js.

Yeah I (un)fortunately learned about delta too late or I probably wouldn't have made this. The main difference is that delta's default styles and appearance did not appeal to me. I'm sure it can be customized, but I wanted something that looked great by default. I especially like that the syntax highlighting matches vscode's since that's the editor I use for work.

I agree that's important! Delta's screenshot colors are so ugly that yours looks like the far superior product. It also seems more focused on diffs. I feel like I could drop in your project instantly, while delta seems to expect configuration.

> syntax highlighting matches vscode

An that's cool. I've always had a dream of having the same syntax highlighting set up everywhere: vscode, bat, vim, git diff... etc.

check out base16 http://chriskempson.com/projects/base16/

link is dead for me

I would much rather use this, a nice secluded statically compiled blob instead of letting node.js unspool a spaghetti of dependencies.

It’s definitely nice that delta doesn’t have a run-time dependency on node.

I use Delta and enjoy it, but using it with Git is a bit frustrating.

I wish it was able to automatically switch from side-by-side to vertical diffs depending on my terminal widt, or at least override it with --side-by-side.

Yes this is the default behavior for git-split-diffs: https://github.com/banga/git-split-diffs#narrow-terminals

Yes! This is my number one thing as well. Let me dig up the tickets...

Edit: https://github.com/dandavison/delta/issues/493#issuecomment-...

When I find myself wanting a split diff in the terminal, I tend to gravitate towards just using Vim’s built in diff mode via vim-fugitive. I even have some git aliases that will open vim and and show fugitive diffs for every file changed on the current branch.

The I like this over fancy CLI diff viewers for a handful of reasons:

- It re-uses my editor config (no need to fuss with that tools ad hoc config format)

- I can navigate the diff with my editor’s navigation tools (expand or hide context lines, open/close/reorganize tabs, etc.)

- My editor’s language-aware tooling kicks in. I can jump to def, reveal types, and find all references while reading the diffs.

I wrote more about some of the specific workflows I use in this post, if you’re curious to level up from a CLI-only diff workflow:

https://blog.jez.io/cli-code-review/

There’s a time and a place for CLI-only diff viewers, and kudos to the author for building a tool they enjoy! I’ve just found that they fit into a sort of uncanny valley of simplicity and power for my needs.

You and I have similar setups! I love it, but there's one thorn that I've not been able to figure out yet.

Have you (or anyone reading this) been able to figure out how to get diff-highlight to be more intelligent so that if 'foo' changes to "foo", the highlighter is smart enough to only highlight the quotes as changing, but not the word foo? (Though this example is trivial, any time you've got two changes on the same line, this issue occurs where everything in between those changes gets highlighted as well.) I noticed that other tools in this thread such as delta and banga don't suffer from this issue.

You can't configure diff-highlight to do that. It 'will find the common prefix and suffix of two lines, and consider everything in the middle to be "different".' [1]

To highlight only the quotes as changing, you need something else. On (Neo)Vim, for example, vim-gitgutter does this [2] (I'm the author).

[1] https://github.com/git/git/tree/master/contrib/diff-highligh... [2] https://github.com/airblade/vim-gitgutter/blob/master/autolo...

Thank you! I’ll check it out. I appreciate it!

gitgutter is amazing, btw. thank you.

I enjoy having good terminal ergonomics for Git.

What works for me is tig for git diffs.

Also very impressive is kitty-diff. If you use kitty as your OpenGL enabled terminal https://sw.kovidgoyal.net/kitty/kittens/diff.html

I forgot kitty has kitty-diff! I love kitty as my terminal.

You can just use icdiff to get handsome-looking split diffs in terminal. https://github.com/jeffkaufman/icdiff

in your .gitconfig

    [diff]
    tool = icdiff

    [difftool]
    prompt = false

    [difftool "icdiff"]
    cmd = /usr/bin/icdiff --line-numbers $LOCAL $REMOTE | less -eFXR

then git difftool

This is cool! A bit slow to start up, probably due to starting up a node process each run, but looks great. Wondering if you have a theme that doesn't include a background color as I quite like my terminal's defaults.

The slowest operation is syntax highlighting: https://github.com/banga/git-split-diffs#performance. I have a PR out to improve that somewhat.

Good point about the themes, I'll add one. I'm hoping to make it easy to customize individual theme colors so you could unset the background colors, for example

I just use `vimdiff`, but this looks better.

Same. I mean... vim, right there already for free, and the invocation is rather ridiculously simpler.

And vimdiff is even an editor not just a viewer.

Now if it was say, Meld in a terminal, that would be worth talking about and I installing some stack as a dependency.

Bad luck! Emacs Ediff worked well for me before Git, and it still does (frequently in a tty, and preferably not with Git).

`diff -y` works in a pinch but I generally use icdiff: https://www.jefftk.com/icdiff

Related but for single pane diffs: https://github.com/so-fancy/diff-so-fancy

The diffs look beautiful. One suggestion to the author be to bundle this as a self-contained binary. This would have a huge impact on whether I want to install it.

For this, I would look into Deno, which supports self contained binaries with typescript. I've never tried it myself so not sure how much work this would be.

Yeah I looked into bundling and deno, but neither of those seemed palatable at this point. Deno’s ecosystem is still quite small, so I’d have to implement things like syntax highlighting from scratch which is not feasible. Other bundling options don’t seem all that reliable / popular and they aren’t really solving the actual issue of untrusted dependencies. So my current take is to just use node and be very conservative with dependencies.

Is anyone familiar with a good way to programatically create a diff like this as an image?

I wrote a small script that tracks changes to your kubernetes cluster and sends a diff of the yaml to Slack. It works but I want to prettify the diff with a GitHub style diff and I need it in image format to send to slack.

I actually tried to automate the screenshots for this project's readme using GitHub actions, but struggled to get it to produce the same quality screenshots as my local machine. This is the script I use for now, which has to be invoked manually: https://github.com/banga/git-split-diffs/blob/main/scripts/g...

Thank you. If you find a better way which works on a headless Linux container let me know. I would be interested in the older versions of your automation even if the output is worse quality so long as the quality is acceptable.

I've been using delta: https://github.com/dandavison/delta

It can be easily set up...

I’ve been looking for just this!!! Thank you!!

Nice work, banga!

:) thanks nayak!

Looks beautiful

This is amazing!

Awesome, thanks!

Nice work!

> 99.1% TypeScript disappointment

Reply on news.ycombinator.com