Simple plug for sending HTTP 103 Early Hints Link headers to improve performance of the first load of your applications
103 Early Hints is a way to send to browser information about resources that will be needed later. It is an alternative to HTTP push that is easier for the developers and browsers, as you do not need to manage cache checking on your own. Usage is pretty simple:
plug PlugEarlyHints,
# List all resources that will be needed later when rendering page
paths: [
# External resources that will be connected to as we will use
# different resources from it. It will speedup as the TLS handshake
# will be already ended, so we will be able to fetch resources
# right away
"https://gravatar.com/": [rel: "dns-prefetch"],
"https://gravatar.com/": [rel: "preconnect"],
# "Regular" resources. We need to set `:as` to inform the client
# (browser) what kinf of resource it is, so it will be able to
# properly connect them
"/css/app.css": [rel: "preload", as: "style"],
"/js/app.js": [rel: "preload", as: "script"],
# Preloading fonts will require additional `:type` and `:crossorgin`
# to allow CSS engine to properly detect when apply the resource as
# well as to prevent double load.
"/fonts/recursive.woff2": [
rel: "preload",
as: "font",
crossorgin: :anonymous,
type: "font/woff2"
]
]
It also supports 2 additional options :callback that supports modifying entries paths in the runtime (useful for Phoenix static assets that are dynamic in their nature) and :enable that allows to dynamically decide when to apply early hints (as it doesn’t really make sense for example for non-HTML resources and can cause problems with non-conforming HTTP clients).
