Hi there,

I think what you are trying to achieve is:

"source": "/(.*).(jpg|jpeg|png|gif|ico|svg)",

The compression on Vercel will be based on the Accept-Encoding header sent in the request, if the header specifies brotli (br) is supported it will be used over gzip. Unfortunately you cannot setup custom Content-Encoding header at this point. While double-compressing the file is one way to add the header, it’s the wrong way and makes performance worse. (the browser will natively decompress our second compression, but then JS will still need to decompress the inner compression)

OK so your advice fixed all my issues.

This is now my updated vercel.json file incase anyone else wishes to see:

1
{
2
  "headers": [
3
    {
4
      "source": "/(.*).(jpg|jpeg|png|gif|ico|svg)",
5
      "headers": [
6
        {
7
          "key": "Cache-Control",
8
          "value": "public, max-age=31536000, immutable"
9
        }
10
      ]
11
    },
12
    {
13
      "source": "/(.*).(css|js)",
14
      "headers": [
15
        {
16
          "key": "Cache-Control",
17
          "value": "public, max-age=2592000"
18
        }
19
      ]
20
    },
21
    {
22
      "source": "/(.*).(html)",
23
      "headers": [
24
        {
25
          "key": "Cache-Control",
26
          "value": "public, max-age=604800"
27
        }
28
      ]
29
    }
30
  ]
31
}

One thing I have noticed I think this https://tools.pingdom.com/ tool does not check for Brotli I believe?

"The compression on Vercel will be based on the Accept-Encoding header sent in the request, if the header specifies brotli (br) is supported it will be used over gzip. Unfortunately you cannot setup custom Content-Encoding header at this point. While double-compressing the file is one way to add the header, it’s the wrong way and makes performance worse. (the browser will natively decompress our second compression, but then JS will still need to decompress the inner compression)"

I was not to sure what was meant from this.

Am I right to presume at this point my site is using brotli compression by default on vercel therefore its not being picked up on that tool? I tried other tools and it says its there, brotli compression that is e.g. on https://www.giftofspeed.com/gzip-test/

Only certain MIME types support Compression. If you test https://www.jamiecropley.ai/css/main.min.css against tool like https://tools.keycdn.com/brotli-test, it should show you.