/dev tips

(76) A better Inspect Element Style Rule Toolbar (78)

Chrome DevTools: A visual representation of the network asset dependency graph

3 Nov 2015
A visual representation of the network asset dependency graph

The network asset dependency graph visually shows the relationships resources have between each other. To try it out, hold shift and hover over the resources in a Network Panel recording.

The following two bullet points correspond to the resource you are currently hovering over:

As a side note, the Network Panel is full of interesting columns. Try enabling some, such as the "Priority" column. This shows the priority the browser assigned to a particular resource (e.g. high, medium or low)

Sign up to receive a developer tip, in the form of a gif, in your inbox each week.