Introducing Callgraphs v2.0

We have completely redesigned the callgraph feature of the Profiler and released it to production today. The beautiful callgraphs are built on top of the awesome libraries d3.js and dagre.

CallgraphCallgraph

Until now Tideways had basic callgraph functionality, using a modified version of the callgraph that Mark Story implemented for XHGui.

By rolling out our own, we can now shape this feature to our own wishes, focus on the strength that our fork of XHProf provides us with.

As a basic start, a color scale from red over orange and yellow to green indicates the functions weight as share of the total response time.

CallgraphCallgraph

Hovering over each node will show its performance details, parent and child calls, and in case of Database and HTTP Functions the Queries and URLs that were requested.

CallgraphCallgraph

You can look at the callgraph of the whole trace or only at subparts. We automatically detect controllers and views from the traces for you, so that you can quickly start profiling the code that you wrote.

CallgraphCallgraph

Clicking on the callgraph button next to the controller or template name shows a reduced graph starting from that function.

Toby Toby 21.11.2014