Syntax Highlighting in the Diff Viewer

I was up late last night experimenting with a new feature for Review Board. The idea was to introduce syntax highlighting for the code in the diff viewer through use of the Pygments library. Actually getting syntax highlighting to work was pretty easy, and before long I had it working. The trick, it turned out, was to get it working with our interline diff support.

Pygments generates a nice HTML-formatted string with span tags, but we need to insert our own span tags for the highlighting. This was a pain, since you need to make sure you place them at the correct locations, keeping in mind the existing span tags and entities. The code also needed to avoid messing up the nesting of tags. After working with it a bit, I had that working as well, and now the code is up for review. In a couple of days, Review Board will have nice syntax-highlighted diff output!

I have some new improvements in the works for the diff algorithm that should result in much better diffs (especially when moving functions around) and improved UI for that case as well. I’ll blog about that later when I have something to show 🙂

Syntax highlighting

9 thoughts on “Syntax Highlighting in the Diff Viewer”

  1. That is totally awesome! When reading diffs I’ve often missed syntax highlighting. I’m eager to try out Review Board in my next project.

  2. apol: It’s open source under the MIT license. Hard to get more free 🙂 It’s compatible with SVN and Perforce, and soon CVS, Git, and Mercurial.

  3. I’m delighted you’re using Pygments to highlight the diffs.

    Was usage of the library for that task straightforward or would you
    want something to change in order to make it easier to integrate?

  4. Georg: The library was very easy to integrate with and I’ve loved it so far. There are, however, a couple of small improvements we would like 🙂

    Mainly, at work, we use *.cc and *.hh files for C++, and the CppLexer doesn’t list those. For the time-being, we’ve hand-patched our copy of Pygments to include these wildcards. We also use Objective C++, which there is no Lexer for, so we’re currently using the ObjectiveCLexer and added a *.mm wildcard to it.

    If we could get these wildcards added to Pygments, it would make things so much nicer for us. If there was a function to register a wildcard with a lexer for the life of that process (just updating the mapping table), that would also be very nice, but the main thing for us is the wildcards.

  5. When I faced a similar problem, I used a combination of VIM (, plugins (2html.vim) and shell scripts to generate a diff html with highlight. As vim supports a huge number of syntaxes, this gives a good general highlighter for free.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top