1d052b16 Update hosting-on-netlify.md 28b96bec Remove double brackets in Netlify hosting tutorial 373ed38b Update deployment instructions from hugo > 0.20 on Netlify 1bbb41ca Generate static assets on deploy in Nanobox tutorial 816d207f Add missing backtick in templates/views.md bf88e772 Add nanobox as a deployment option 9c37b4cc Change config's syntax order matching description d3cb05a7 Fix wrongly named default value of publishDir 4be85c54 Add link to showcase a theme setup via config file 46837195 Init and update of submodules in .gitlab-ci.yml 9e7c2827 Add CSS lang argument to code block 85aad56e Abstract the type in the lookup order 4e1e43e9 Fix broken Pygments url 65b4e79b Correct GitLab project pipelines URL 94af72b5 Fix .Data.Terms usage in taxonomy template example eb371e52 functions: Fix lang.NumFmt docs a745cd6c Fix layouts' folder name in template primer e181e637 Correct typo on GitHub pages guide (#151) 28698500 Remove HTML special chars from Windows install example 96b1f5b5 Remove not needed escape slashes in urls.md 2e05043f Add upgrade instructions using homebrew 2a14624d Fix alias in countrunes.md 5e26bb97 Update docker image for build/publish 01424887 List the internal templates a3ef5be9 Remove string concatenation from add (math) sample 43d12b44 Fix typo 89bafa49 Change to Asciidoc URI 4e14071e Removes an extra bracket (>) in single-page-templates.md 0938e423 Fix typo in http2 server push blog fac55121 Fix typo in deployment with rsync tutorial git-subtree-dir: docs git-subtree-split: 1d052b16a1290ada12f1e28c7c0c373f86741071
2.6 KiB
title | date | description | categories | slug | aliases | author | images | ||
---|---|---|---|---|---|---|---|---|---|
HTTP/2 Server Push in Hugo | 2017-07-24T18:36:00+02:00 | As every page in Hugo can be output to multiple formats, it is easy to create Netlify's _redirects and _headers files on the fly. |
|
http2-server-push-in-hugo | bep |
|
Netlify recently announced support for HTTP/2 server push, and we have now added it to the gohugo.io sites for the main CSS
and JS
bundles, along with server-side 301 redirect support.
If you navigate to https://gohugo.io and look in the Chrome developer network console, you should now see Push
as the new source ("Initiator") for the CSS
and JSS
:
{{< figure src="/images/blog/hugo-http2-push.png" caption="Network log for https://gohugo.io" >}}
Setting up this in Hugo was easy:
1. Configure Netlify Output Formats
Add a new custom media type and two new output formats to config.toml
. For more on output formats in Hugo, see Custom Output Formats.
[outputs]
home = [ "HTML", "RSS", "REDIR", "HEADERS" ]
[mediaTypes]
[mediaTypes."text/netlify"]
suffix = ""
delimiter = ""
[outputFormats]
[outputFormats.REDIR]
mediatype = "text/netlify"
baseName = "_redirects"
isPlainText = true
notAlternative = true
[outputFormats.HEADERS]
mediatype = "text/netlify"
baseName = "_headers"
isPlainText = true
notAlternative = true
2. Add Template For the _headers File
Add layouts/index.headers
:
/*
X-Frame-Options: DENY
X-XSS-Protection: 1; mode=block
X-Content-Type-Options: nosniff
Referrer-Policy: origin-when-cross-origin
*/
Link: <{{ "dist/app.bundle.js" | relURL }}>; rel=preload; as=script
Link: <{{ "dist/main.css" | relURL }}>; rel=preload; as=style
The template above creates both a security header definition and a HTTP/2 server push configuration.
Also note that this is a template for the home page, so the full Page
with its Site
and many variables are available. You can also use partial
to include other templates.
3. Add Template For the _redirects File
Add layouts/index.redir
:
# Netlify redirects. See https://www.netlify.com/docs/redirects/
{{ range $p := .Site.Pages -}}
{{ range .Aliases }}
{{ . | printf "%-35s" }} {{ $p.RelPermalink -}}
{{ end -}}
{{- end -}}
The template above creates 301 redirects for your aliases, so you will probably want to turn off aliases in your config.toml
: disableAliases = true
.