New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 29 users

Issue metadata

Status: Fixed
Owner:
Closed: Jul 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 2
Type: Feature



Sign in to add a comment
link

Issue 464501: DevTools: [network] visualize http2 server push

Reported by ole.mich...@gmail.com, Mar 5 2015

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.76 Safari/537.36

Steps to reproduce the problem:
1. open dev tools (network tab)
2. make a request to a HTTP2 ready server

What is the expected behavior?
I think it would be awesome if I could actually see when certain things happen which can only occur in HTTP2 for example a server pushes down some more resources together with a leading request or when the server or client reprioritise a stream.

I also like to toss in what I could imagine on how this could be displayed:
for the server push event what one could do is to indicates with little arrows in the network tab.
The first step for the stream reprioritization could be just another event in the hover tooltip.

please find my little sketch attached to grasp a idea what I'm talking about.

What went wrong?
nothing :)

Did this work before? No 

Chrome version: 41.0.2272.76  Channel: stable
OS Version: OS X 10.10.2
Flash Version: Shockwave Flash 16.0 r0

paul irish send me here: https://twitter.com/paul_irish/status/573583778968309760
 
Screen_Shot_2015-03-05_at_21_59_36.png
398 KB View Download

Comment 1 by jonathan...@gmail.com, Mar 5 2015

Cc: paulir...@chromium.org eustas@chromium.org
Labels: -Type-Bug -OS-Mac Type-Feature OS-All
I personally find this idea interesting. However, I wonder what use-case is this solving? Is it providing any benefit or helping the developer achieve something beyond showing that HTTP/2 is working as it should?

Comment 2 by ole.mich...@gmail.com, Mar 5 2015

So why what I was looking for was exactly what you are describing. It shows people that HTTP actually works as it should. I think especially at the beginning this is pretty cool to show people how and that it actually works, which might help http2 to get traction.

When you said it's just a tool to see that HTTP2 works as it should. That is also why there are headers exposed for example, I can also debug all network which is in between. A thing i might think of, is a proxy which triggers a push on HTTP2 but has a HTTP/1.1 server behind and knows about the content relations.

Comment 3 by sidv@chromium.org, Mar 7 2015

Cc: b...@chromium.org
Labels: Cr-Internals-Network-HTTP2

Comment 4 by yu...@chromium.org, Mar 10 2015

Owner: eustas@chromium.org
Status: Assigned

Comment 5 by paulir...@chromium.org, Mar 19 2015

Cc: mgramont@google.com
Summary: DevTools: [network] visualize http2 server push (was: display http2 events in devtools)
Let's have this ticket just focus on server push. If we need dedicated functionality for other h2 parts, lets file seperately.

Attached a screenshot of server push in about:net-internals 

Working mock for this behavior is above.
net-internals-server-push.png
977 KB View Download

Comment 6 by igrigo...@chromium.org, Mar 19 2015

Cc: igrigo...@chromium.org

Comment 7 by lafo...@chromium.org, Sep 23 2015

Labels: Hotlist-Recharge
This issue likely requires triage.  The current issue owner maybe inactive (i.e. hasn't fixed an issue in the last 30 days).  Thanks for helping out!

-Anthony

Comment 8 by ericbide...@google.com, Oct 29 2015

Any progress on this? h2/push is becoming increasingly available to devs and it's currently really hard to know what is working and what isn't.

Comment 9 by pfeldman@chromium.org, Oct 29 2015

Owner: ----
Status: Available
Nope, no progress.

Comment 10 by paulir...@chromium.org, Nov 19 2015

Owner: caseq@chromium.org
caseq, here is that one we heard a few times yesterday.

Comment 12 by dajdav...@gmail.com, Nov 26 2015

I've spent a lot of time lately experimenting with server push, and the two ways I have of checking it is either FF in WebPageTest as it shows me really quickly and simply that it's working or dig into net-internals which is slightly more long winded.

I know it's not for this issue but visualising the prioritisation of the frames would be really handy too as sometimes servers don't work as we expect e.g. pushing resources in an unexpected order - https://github.com/h2o/h2o/issues/584

Comment 13 by paulir...@chromium.org, Nov 30 2015

Related: rebecca murphey has released a tool to visualize http2 stream data from net-internals output: https://github.com/rmurphey/chrome-http2-log-parser

Comment 14 by dgozman@chromium.org, Dec 18 2015

Status: Assigned

Comment 15 Deleted

Comment 16 by caseq@chromium.org, Mar 24 2016

Status: Started (was: Assigned)
This is currently being worked on: https://codereview.chromium.org/1828203005

Comment 17 by ajaya...@akamai.com, Mar 24 2016

Thanks so much.

adding my original comment back into this thread.

Has there been a resolution to this ? - I am facing trouble showing benefits of server push. I second the notion "having to go down a long winded approach of pulling up net-internals and digging at the logs" is not appealing. Users are familiar with devtools and it's easy to interpret. With a growing use of Server push I see this as a critical path for showing the value and adoption of server push in H2

Comment 18 by caseq@chromium.org, Mar 25 2016

Attaching screenshot -- note "Push" indication in the Initiator column + light-blue bars in Timeline and timing popover.
server-push.png
64.9 KB View Download

Comment 19 by ajaya...@akamai.com, Mar 28 2016

do we know which version of Chrome this will be shipped ?

Comment 20 by paulir...@chromium.org, Mar 28 2016

51. it will probably be landing in canary this coming week.

Comment 21 by ajaya...@akamai.com, Mar 28 2016

thanks!

Comment 22 by bugdroid1@chromium.org, Apr 20 2016

Project Member
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/e8340bc90789f2084eb1cb128b87679170a5d59d

commit e8340bc90789f2084eb1cb128b87679170a5d59d
Author: caseq <caseq@chromium.org>
Date: Wed Apr 20 00:02:57 2016

Expose SPDY pushes in DevTools

This adds push start/end times to LoadTimingInfo and plumbs it all
the way to DevTools Network panel.

BUG= 464501 

Review URL: https://codereview.chromium.org/1828203005

Cr-Commit-Position: refs/heads/master@{#388367}

[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/chrome/browser/devtools/devtools_sanity_browsertest.cc
[add] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/chrome/test/data/devtools/image.png
[add] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/chrome/test/data/devtools/push_test_page.html
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/content/child/resource_dispatcher.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/content/child/web_url_loader_impl.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/content/common/inter_process_time_ticks_converter.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/content/common/inter_process_time_ticks_converter_unittest.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/content/common/resource_messages.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/base/load_timing_info.h
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/base/load_timing_info_test_util.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/spdy/spdy_network_transaction_unittest.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/spdy/spdy_stream.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/spdy/spdy_stream_unittest.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/net/url_request/url_request_unittest.cc
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/core/inspector/InspectorResourceAgent.cpp
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/Tests.js
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/network/NetworkDataGridNode.js
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/network/NetworkOverview.js
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/network/RequestTimingView.js
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/network/networkLogView.css
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/front_end/network/networkPanel.css
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/devtools/protocol.json
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/platform/exported/WebURLLoadTiming.cpp
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/platform/network/ResourceLoadTiming.cpp
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/Source/platform/network/ResourceLoadTiming.h
[modify] https://crrev.com/e8340bc90789f2084eb1cb128b87679170a5d59d/third_party/WebKit/public/platform/WebURLLoadTiming.h

Comment 23 by ericbide...@google.com, Apr 29 2016

One thing I've been thinking that would be useful is to know if/when a push'd resource was already in the browser's cache and the push promise rejected b/c of that. 

Questions I'd like to be able to answer with this:
- is my app benefiting from push?
- how many push'd resources is too many?
- what resources would benefit from being push'd?
- what resources didn't really need to be push'd (e.g. they were already in the cache, and I should think about pushing other critical resources).

Will the upcoming devtools improvements help answer those questions?

Comment 24 by b...@chromium.org, Apr 29 2016

Re #23:  Note that Chrome currently does not reset pushed streams if the resource is in the cache.  This is  issue 232040 .

Comment 25 by sebdecke...@gmail.com, Apr 29 2016

Thank you for this feature. It has been very helpful to me. :)

Perhaps consider visualising all pushed resources, not just those that were subsequently requested by the client/page. I.e. a server might push resources that the client does not later consume, yet they would have an impact on page load time. Visualising could be useful in debugging or optimising such issues.
Thank you for this feature. It is very useful.

Is this push information available in any chrome api that is accessible to an extension with a dev-tools page? 

It does not appear to be anywhere in the timings object retrieved using the chrome.devtools.network API. I do see it in the response object received when using the chrome.debugger api, but that api is not available when the dev-tools page is open.

Comment 27 by caseq@chromium.org, Jul 30 2016

Status: Fixed (was: Started)

Sign in to add a comment