Drawing Git history with explainable branches
Real merges, explicitly inferred squash branches, and a Canvas fallback in Git Tree Visualizer.
Git Tree Visualizer grows a pixel-art tree from a public repository. First-parent history becomes the trunk. Merge history forms limbs, with commits as leaves and time as rings. Sound follows the growth, and the flat tree unfolds into a view you can orbit.
What does a branch mean? The answer needs to come from the repository.
Explain the inference
A merge commit gives the layout a relationship it can follow. Squash merges leave a different record: the branch's original sequence may no longer be in the reachable commit graph. Drawing those original commits as if they were still there would misstate what the data contains.
The visualizer can reconstruct squash branches from pull request metadata, but it labels them as reconstructed and draws them dashed and ghosted, without linking to commit SHAs that no longer exist.
When no branch structure can be recovered, the app uses a directory view and labels it. The skeleton then comes from the file tree. The project documentation describes both cases.
Separate layout from interpretation
An author view groups contributors into primary limbs. It changes the tree's meaning, so the interface calls it an author view.
Color lenses leave the layout in place. They show age, author, or churn on the same graph, letting you compare readings without losing your position.
The file-type lens has another limitation. GitHub's GraphQL commit response doesn't include the touched file paths it needs. The interface says so. It doesn't guess the categories.
Keep the tree available
WebGL can be unavailable in a current browser because of privacy settings, policy, drivers, or its execution environment; to cover that case, the app has two renderers over the same graph.
Three.js draws the GPU version. Without it, a Canvas software renderer draws the same low-resolution tree. It keeps growth, orbit, selection, lenses, and the timeline, while simplifying decorative lighting and limb sway. A badge names the renderer that's running.
The renderer notes include a URL option that forces the software path. That makes it possible to test the fallback on a machine with a working GPU.
Make a view shareable
The URL holds the selected commit, lens, mode, ring granularity, and time window, which share images use too, so a link to a particular period can keep describing it after the repository gains more commits.
Audio starts with a user gesture and has a mute control. You can also walk the graph with the keyboard to investigate a commit, then share that view through its URL.
Grow a tree or read the project details.