LLVM-FLOW is an open-source tool released together with LLVM-BLOCK. It provides a web-based application for interactively visualizing LLVM IR Control Flow Graphs (CFGs) and comparing two CFGs.
Its main goal is to make it easy to see the differences in CFGs before and after optimization.
With LLVM-FLOW, users can directly inspect complex CFGs and see which blocks changed or remained, with differences highlighted using colors.
Key Features
CFG Generation and Comparison
Users can upload IR code through the web interface, optionally apply optimization passes, or provide two different IR versions for comparison.
LLVM-FLOW generates the CFGs and displays them side by side. Using the LLVM-BLOCK algorithm, it automatically detects identical basic blocks between the two graphs.
Identical blocks are highlighted with the same color, while unmatched blocks appear uncolored, indicating newly created or removed blocks due to optimization.
Interactive Exploration
Users can drag nodes, zoom in/out, and pan to navigate large graphs.
Layout direction (vertical/horizontal) can be switched to improve readability.
This makes analyzing even large, complex graphs much more manageable.
Detail Mode
In basic mode, each block node shows only the block name.
In detail mode, each block displays its full IR instructions inside the node.
Alternatively, double-clicking a node opens a popup showing the block’s instructions.
This allows analysis not only at the block level but also at the instruction level, without opening .ll files separately.
Node/Edge Highlighting
Selecting a block in one CFG highlights the corresponding block in the other CFG, if it exists.
Similarly, selecting an edge highlights its source and target blocks, making it easier to trace control flow paths in complex graphs.
File Download and History
Users can download transformed .ll files generated inside LLVM-FLOW.
For example, uploading an IR and applying the mem2reg pass produces a new IR that can be both visualized and downloaded.
Upload history is also managed, so past comparisons can be reopened conveniently.
Example
The figure above shows an LLVM-FLOW interface: the left is the pre-optimization CFG (9 nodes, 10 edges), and the right is the post-optimization CFG (7 nodes, 8 edges).
Purple-bordered blocks exist in both versions, meaning they are identical blocks identified by LLVM-BLOCK.
Gray blocks exist only on one side, indicating changed parts.
For instance, %2, %11, %14, and %17 exist in both CFGs and thus represent unchanged code, while %87 vs %85, %80 vs %79 are unmatched and represent removed or newly created blocks.
Ease of Use
LLVM-FLOW is very user-friendly: as a web application, it runs directly in the browser.
For offline use, it can also be deployed locally using Docker images.
Users simply input or upload IR code, choose comparison targets or passes to apply, and click “Generate CFG” to view results.
Summary
LLVM-FLOW provides CFG visualization and comparison for LLVM IR, with an interactive UI that makes it easy to understand optimization effects.
Built on top of LLVM-BLOCK’s “identical block detection,” it highlights common blocks across two CFGs, allowing developers to focus only on changed parts.
It is especially useful for visualizing compiler optimizations, making research presentations and documentation clearer.
By using LLVM-FLOW, abstract IR code can be explored graphically and intuitively, improving debugging and research productivity in LLVM-based projects.
