Kerstin28
Active member
I'm considering to utilize HTTP/2 server push to improve the XenForo loading time. The idea is to minimize the loading time of render-blocking CSS and JS resources. While HTTP/2 is mostly application agnostic, the webserver requires application-specific hints in the form of "Link" headers to utilize the push feature.
Some background on HTTP/2 server push: https://dexecure.com/blog/http2-push-vs-http-preload/
A webserver with support for HTTP/2 server push will parse "Link" headers with "rel=preload" to select the resources to be pushed to the browser. Without HTTP/2 support on client or server side, this will degrade gracefully into HTTP/1.1 preload or be ignored altogether if neither push nor preload are supported.
Setting the Link header
One way to set "Link" headers is to configure them statically via .htaccess or the webserver configuration. This would allow to push jQuery (if self-hosted), but here the list ends. Other JS resources come with a version in the query string, so a static configuration must be updated whenever the version changes. Without automation this is begging to become inconsistent.
Question: what is the query string version based on? Is there a way to retrieve the version string automatically?
Apart from versioning, XenForo comes with a clever approach to include CSS and JS resources only when required by the rendered page. CSS resources are generated on demand. Ideally, XenForo (or an add-on) would generate "Link" headers when compiling the list of resources to be included. This can be easily achieved with PHP (see https://blog.cloudflare.com/using-http-2-server-push-with-php/), as long as it happens before the rendered page is printed.
Question: is this possible with the XenForo architecture? Can you provide me a pointer where an add-on would need to hook in?
Feel free to add your thoughts, if I overlooked something.
I'm using Apache 2.4 and XF 1.5, but this thread is not limited to those. Answers related to XF 2 are welcome.
Some background on HTTP/2 server push: https://dexecure.com/blog/http2-push-vs-http-preload/
A webserver with support for HTTP/2 server push will parse "Link" headers with "rel=preload" to select the resources to be pushed to the browser. Without HTTP/2 support on client or server side, this will degrade gracefully into HTTP/1.1 preload or be ignored altogether if neither push nor preload are supported.
Setting the Link header
One way to set "Link" headers is to configure them statically via .htaccess or the webserver configuration. This would allow to push jQuery (if self-hosted), but here the list ends. Other JS resources come with a version in the query string, so a static configuration must be updated whenever the version changes. Without automation this is begging to become inconsistent.
Question: what is the query string version based on? Is there a way to retrieve the version string automatically?
Apart from versioning, XenForo comes with a clever approach to include CSS and JS resources only when required by the rendered page. CSS resources are generated on demand. Ideally, XenForo (or an add-on) would generate "Link" headers when compiling the list of resources to be included. This can be easily achieved with PHP (see https://blog.cloudflare.com/using-http-2-server-push-with-php/), as long as it happens before the rendered page is printed.
Question: is this possible with the XenForo architecture? Can you provide me a pointer where an add-on would need to hook in?
Feel free to add your thoughts, if I overlooked something.
I'm using Apache 2.4 and XF 1.5, but this thread is not limited to those. Answers related to XF 2 are welcome.