Skip to content

Instantly share code, notes, and snippets.

@akyoto
Last active March 5, 2018 13:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save akyoto/266fb40a8f3811cce183e21cd1b94315 to your computer and use it in GitHub Desktop.
Save akyoto/266fb40a8f3811cce183e21cd1b94315 to your computer and use it in GitHub Desktop.
HTTP/2 Push async flows

Problem

See Start your pushes before you respond.

Indeed we can fix the problem by pushing before the HTML is sent, however that increases TTFB by a lot and creates a completely new set of performance problems. Therefore we're pushing resources after sending the HTML. When we do that, there are 2 possible async flows that can occur.

Flow under normal network conditions:

  1. Server sends HTML.
  2. Server pushes CSS/JS.
  3. Client receives HTML.
  4. Client receives information about the push.
  5. Client parses HTML and notices CSS link reference.
  6. Client knew about the push, hence loads CSS from push without sending an additional request.

Flow in the worst case:

  1. Server sends HTML.
  2. Server pushes CSS/JS.
  3. Client receives HTML.
  4. Client parses HTML and notices CSS link reference.
  5. Client doesn't know about the push yet, therefore sends a request for the stylesheets to the server.
  6. Client receives information about the push but it's already too late.

Actual testing

In most of my tests using the Chrome browser (as the other browsers lack tools to show if a resource has been loaded from push), the worst case scenario has only happened a few times. However, I was wondering if there is any standardized way to prevent it.

Update, March 2018: In recent Chrome versions (64+), this synchronization issue seems to be more frequent.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment