github.com/rabbouni145/gg@v0.47.1/docs/content/en/news/http2-server-push-in-hugo.md (about)

     1  ---
     2  title: "HTTP/2 Server Push in Hugo"
     3  date: 2017-07-24T18:36:00+02:00
     4  description: >
     5      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.
     6  categories: [blog]
     7  keywords: []
     8  slug: "http2-server-push-in-hugo"
     9  aliases: []
    10  author: bep
    11  images:
    12  - images/gohugoio-card-1.png
    13  ---
    14  
    15  **Netlify** recently announced support for [HTTP/2 server push](https://www.netlify.com/blog/2017/07/18/http/2-server-push-on-netlify/), 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. 
    16  
    17  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`:
    18  
    19  {{< figure src="/images/blog/hugo-http2-push.png" caption="Network log for https://gohugo.io" >}}
    20  
    21  **Setting up this in Hugo was easy:**
    22  
    23  ## 1. Configure Netlify Output Formats
    24  
    25  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](/templates/output-formats/).
    26  ```bash
    27  [outputs]
    28  home = [ "HTML", "RSS", "REDIR", "HEADERS" ]
    29  
    30  [mediaTypes]
    31  [mediaTypes."text/netlify"]
    32  suffix = ""
    33  delimiter = ""
    34  
    35  [outputFormats]
    36  [outputFormats.REDIR]
    37  mediatype = "text/netlify"
    38  baseName = "_redirects"
    39  isPlainText = true
    40  notAlternative = true
    41  [outputFormats.HEADERS]
    42  mediatype = "text/netlify"
    43  baseName = "_headers"
    44  isPlainText = true
    45  notAlternative = true
    46  ```
    47  ## 2. Add Template For the _headers File 
    48  
    49  Add `layouts/index.headers`:
    50  
    51  ```bash
    52  /*
    53    X-Frame-Options: DENY
    54    X-XSS-Protection: 1; mode=block
    55    X-Content-Type-Options: nosniff
    56    Referrer-Policy: origin-when-cross-origin
    57  */
    58    Link: <{{ "dist/app.bundle.js" | relURL }}>; rel=preload; as=script
    59    Link: <{{ "dist/main.css" | relURL }}>; rel=preload; as=style
    60  ```
    61  The template above creates both a security header definition and a HTTP/2 server push configuration.
    62  
    63  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.
    64  
    65  
    66  
    67  
    68  ## 3. Add Template For the _redirects File 
    69  Add `layouts/index.redir`:
    70  ```bash
    71  # Netlify redirects. See https://www.netlify.com/docs/redirects/
    72  {{  range $p := .Site.Pages -}}
    73  {{ range .Aliases }}
    74  {{  . | printf "%-35s" }}	{{ $p.RelPermalink -}}
    75  {{ end -}}
    76  {{- end -}}
    77  ```
    78  The template above creates 301 redirects for your [aliases](/content-management/urls/#aliases), so you will probably want to turn off aliases in your `config.toml`: `disableAliases = true`.
    79