HTTP/2 server push
- English
- 日本語
HTTP/2 server push allows you to set up rules that enable Fastly to pre-emptively load and then send responses to an HTTP/2-compliant client before that client requests them. You can initiate an HTTP/2 server push via a response header or VCL function.
Server push with the link response header
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:
link: </assets/jquery.js>; rel=preload; as=scriptWe support multiple link headers and multiple assets in one link title:
link: </assets/jquery.js>; rel=preload; as=script, </assets/base.css>; rel=preload; as=styleAdditional 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:
link: </assets/jquery.js>; rel=preload; as=scriptIf used with the nopush directive, the header will not trigger a push and will be passed as is to the client:
link: </assets/jquery.js>; rel=preload; as=script; nopushIf 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:
link: </assets/jquery.js>; rel=preload; as=script; x-http2-push-onlyThe attributes can be mixed and matched if needed:
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-onlyLink headers and Amazon S3 buckets
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:
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.