Getting started
Basics
Domains & Origins
Performance

Configuration
Basics
Conditions
Dictionaries
Domains & Origins
Request settings
Cache settings
Headers
Responses
Performance
Purging
Custom VCL
Image optimization
Video

Security
Access Control Lists
Monitoring and testing
Securing communications
Security measures
TLS
Web Application Firewall

Integrations
Logging endpoints
Non-Fastly services

Diagnostics
Streaming logs
Debugging techniques
Common errors

Account info
Account management
Billing
User access and control

Reference

    HTTP/2 server push

      Last updated August 01, 2018

    Fastly recognizes link headers with the preload keyword sent by an origin server and pushes the designated resource to a client. For example, this link response header triggers an HTTP/2 push:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script
    

    We support multiple link headers and multiple assets in one link header:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script, </assets/base.css>; rel=preload; as=style
    

    Additional attributes used in the link header can further control server push and how the header itself is handled. If no additional attributes are included, the link header will trigger server push and be forwarded to the client:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script
    

    If used with the nopush directive, the header will not trigger a push and will be passed as is to the client:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script; nopush
    

    If used with the x-http2-push-only directive, the header will trigger a server push but will be subsequently removed and not forwarded to the client:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script; x-http2-push-only
    

    The attributes can be mixed and matched if needed:

    1
    
    link: </assets/jquery.js>; rel=preload; as=script, </assets/base.css>; rel=preload; as=style; nopush, </assets/main.css>; rel=preload; as=style; x-http2-push-only
    

    If you're using an Amazon Simple Storage Service (S3) bucket as your origin server, you can still use link headers by applying a cache setting condition like this one:

    set beresp.http.Link = beresp.http.x-amz-meta-Link

    Server push with the h2.push() function

    Server push can also be triggered with the h2.push() VCL function. The asset to be pushed is passed to the function as a parameter. For example:

    1
    2
    3
    4
    5
    6
    7
    8
    
    sub vcl_recv {
    #FASTLY recv
    
      if (fastly_info.is_h2 && req.url ~ "^/index.html")
      {
        h2.push("/assets/jquery.js");
      }
    }
    

    The h2.push() function triggers server push as soon as it's called, which removes the need for a link header to arrive with a server response. This means assets can be pushed to the client before the response for the request that triggered the push is received from the server, accelerating their delivery.

    Back to Top

    Additional resources: