The concept of the Cosmograph

Large-scale graph visualizations are tricky. The more points and links you have in your network, the more difficult it is to compute the layout for it. Graph layout defines where on a canvas the points will be placed. No layout, no visualization!

Rendering a large number of points and links is also challenging. For example, if you try to animate more than a few thousand objects with SVG, it will fail, and you’ll have to find another technique to do it. Can you take advantage of a GPU to help draw so many data points? Of course, you can! Using WebGL to render complex visualizations is becoming more common these days. But is it possible to use the power of a GPU to calculate the layout of your graph? The answer is yes, with Cosmograph!

GPU-accelerated Force Layout

One of the key techniques used in network graph visualization is a force layout. This is a type of physical simulation that defines various forces that act on the points of your graph. For example, a spring force between connected points will pull them together, a many-body repulsion force will push points away from each other, and a gravitational force will bring unconnected parts of the graph together in simulation space. Many libraries implement various types of force layout simulations. Almost all of them use the CPU to perform the computations, and they get slower as the number of points increases, usually choking at around 100,000 points.

GPU-based force layout algorithms are much less common; they are more difficult to write. Using the traditional approach to implementing the many-body force (the most complex force in the simulation) won’t make the calculations noticeably faster because random memory access operations (reading or writing data from the computer’s memory) are slow on GPUs, and you’ll need a lot of them (e.g., when you need to get information about two different points to calculate the forces, and their data is far apart in memory).

When you need to visualize a large network, you usually have to use desktop visualization tools that first compute the layout using an optimized CPU algorithm and then visualize the result. You can also use more sophisticated tools that compute the layout on their server and then render your graph in the browser using WebGL. Or, you might use sophisticated and powerful command-line tools.

However, we have come up with a much more user-friendly solution. We developed a technique that allows us to completely implement force graph simulation on the GPU. It is amazingly fast, and it works on the web!

Technology stack

To enable blazingly fast GPU-powered graph visualization, Cosmograph leverages a cutting-edge stack of technologies under the hood:

• Apache Arrow provides efficient delivery of data into the WebGL renderer. The Apache Arrow table format is low-level and optimized for performance, allowing seamless transfer of large datasets to the GPU.

• DuckDB-Wasm serves as the backend for lightning-fast data operations. Running in WebAssembly, DuckDB-Wasm can efficiently filter, aggregate, and transform large datasets entirely in the browser. This enables Cosmograph to provide a fluid and responsive experience even with massive graphs.

• Mosaic Core is a powerful framework for building interactive visualizations declaratively. Its reactive dataflow architecture efficiently updates visualizations in response to user input. Mosaic Core’s data cube indexing technique supports real-time interaction with billion+ element databases and caches the results of expensive computations, allowing Cosmograph to process complex data queries rapidly.

At the heart of Cosmograph lies our @cosmograph/cosmos, a state-of-the-art GPU-accelerated force graph layout algorithm and rendering engine. Cosmos harnesses the parallel processing power of GPUs to calculate force-directed layouts for graphs with hundreds of thousands or even millions of points in mere seconds. By offloading compute-intensive tasks to the GPU, Cosmos frees up the CPU to focus on other aspects of the application, resulting in an incredibly smooth and interactive visualization experience.

The seamless integration of these technologies allows Cosmograph to push the boundaries of what’s possible with in-browser graph visualization. Whether you’re exploring social networks, biological pathways, or any other complex connected data, Cosmograph provides a fast, fluid, and insightful interface to make sense of it all.