Chrome Devtool do not show Content-Encoding in response headers

Question

I´m enabling gzip compression to increase the speed in Google PageSpeed Insights:

If compressed mantaspersonalizadas.com/fonts/Cocktail-Shaker.svg, would save 144.1 KB (65% reduction). If compressed mantaspersonalizadas.com/fonts/Cocktail-Shaker.ttf, would save 62.6 KB (49% reduction). If compressed mantaspersonalizadas.com/fonts/Cocktail-Shaker.woff, would save 2.6 KB (5% reduction).

I use an Apache Server, I add this code to .htacess:

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/xml
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/opentype

# For Olders Browsers Which Can't Handle Compression
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>

How to check if deflate is enabled in my local server?

Chrome DevTools don´t show Content-Enconding:

Oisin

Answer 1

Let's put it to the test.

Chrome request to example.com (contains gzip):

GET / HTTP/1.1
Host: www.example.com
Connection: keep-alive
Cache-Control: max-age=0
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.75 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8
If-None-Match: "359670651"
If-Modified-Since: Fri, 09 Aug 2013 23:54:35 GMT

Chrome response from example.com (does not contain gzip):

HTTP/1.1 304 Not Modified
Accept-Ranges: bytes
Cache-Control: max-age=604800
Date: Thu, 08 Dec 2016 14:06:04 GMT
Etag: "359670651"
Expires: Thu, 15 Dec 2016 14:06:04 GMT
Last-Modified: Fri, 09 Aug 2013 23:54:35 GMT
Server: ECS (iad/182A)
Vary: Accept-Encoding
X-Cache: HIT

Curl request (clone of Chrome request, contains gzip):

curl -I
    -H "GET / HTTP/1.1"
    -H "Host: www.example.com"
    -H "Connection: keep-alive"
    -H "Cache-Control: max-age=0"
    -H "Upgrade-Insecure-Requests: 1"
    -H "User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.75 Safari/537.36"
    -H "Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8"
    -H "Accept-Encoding: gzip, deflate, sdch"
    -H "Accept-Language: en-US,en;q=0.8"
    -H "If-None-Match: "359670651""
    -H "If-Modified-Since: Fri, 09 Aug 2013 23:54:35 GMT"
    example.com

Curl response (contains gzip):

HTTP/1.1 200 OK
Content-Encoding: gzip
Accept-Ranges: bytes
Cache-Control: max-age=604800
Content-Type: text/html
Date: Thu, 08 Dec 2016 14:18:34 GMT
Etag: "359670651"
Expires: Thu, 15 Dec 2016 14:18:34 GMT
Last-Modified: Fri, 09 Aug 2013 23:54:35 GMT
Server: ECS (iad/182A)
X-Cache: HIT
x-ec-custom-error: 1
Content-Length: 606

Conclusion

Chrome does currently not show the content-encoding. Neither does Firefox. I don't know why.

Now that I know they're not showing me everything, I'm never trusting either with response header information ever again.

Curl all the way.

Procephalic

I stumbled upon this after messing with my production server for 2hrs! I can confirm that, as of october 2017, Chrome+Firefox don't even display the compression hreader for the main page in DevTools, but they does for every other resource (such as CSS, JS and even Ajax-loaded page). See here: s1.postimg.org/2rv29kk73j/z_Shot_1507239352.png The proposed curl trick works reliably for me. – Cherian

Answer 2

It seems a problem Chrome browser, I had same problem I though that deflate is not working at the server, but then I tried Firefox and used firebug which correctly showed Content-Encoding in the headers.

Also the downloaded file size in Chrome didnt showed the uncompressed file size, while Firefox showed the correct compressed files size.

Bolivar

Answer 3

As @Jay stated

Chrome does currently not show the content-encoding. Neither does Firefox. I don't know why.

As of december 2018, same behavior in both Chrome and Firefox, and Firebug is gone.

The Firefox Developer Edition does the trick for me, showing the correct content encoding within the response headers section ([F12] -> Network Tab -> select a ressource -> Headers Tab).

Screenshot: content encoding shows up in Firefox Developer Tools

Pennyroyal