GoogleChrome / GoogleChrome/lighthouse

Critical Network Waterfall visualization.

Open
#1,451 8 comments 1 reaction 0 assignees View on GitHub
feature P3
Dominant language
JavaScript
Stars
30.8k
Forks
9.8k
Avg merge
1d 14h
Merged PRs (30d)
20

Description

Currently we have a fairly droll representation of the network waterfall.

Paul Lewis did some fantastic mocks that explore how Lighthouse could better render the entire critical path:

![image](https://cloud.githubusercontent.com/assets/39191/21869146/eff21a7e-d80a-11e6-9206-3451812fd912.png)
![image](https://cloud.githubusercontent.com/assets/39191/21869200/47319ddc-d80b-11e6-9925-95ce13f315aa.png)

Only slightly relevant, an ugly one from me, trying to combine a smarter network waterfall with grouping by initiator:
![image](https://cloud.githubusercontent.com/assets/39191/21869126/e1be0044-d80a-11e6-816d-7a7f1413b6c6.png)

-----------------

We can do something along these lines, and dramatically improve how folks understand the key network requests. The scope is a tad smaller than the images above, as we want to start only with replacing the "Critical Network Chains" visualization, and not yet deal with screenshots, main thread activity, or metrics.

**Is someone interested in investigating this?** We need someone with good skills in visualizing data to take this on.

It'll require some experimenting and iteration, but we will end up with way of representing this data that will be awesome.I also expect a successful design to be adopted by chrome devtools, at least.

Contributor guide

Open the contributing guide

Research direction

No implementation file, entry point, or test is named. Locate the existing Critical Network Chains visualization and review how its data is rendered, then iterate on a replacement focused on the critical path and network requests. Done means the current visualization is replaced without expanding into screenshots, main-thread activity, or metrics.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.