Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Specify a Vary: Accept-Encoding header?

Google and pingdom.com says i should "Specify a Vary: Accept-Encoding header"

i do not know or understand how to do this. Can anyone explain what it is and what it does?

like image 978
jshariar Avatar asked May 20 '13 03:05

jshariar


People also ask

What is vary accept-Encoding header?

It is allowing the cache to serve up different cached versions of the page depending on whether or not the browser requests GZIP encoding or not. The vary header instructs the cache to store a different version of the page if there is any variation in the indicated header.

How do I add a accept-Encoding header?

To check this Accept-Encoding in action go to Inspect Element -> Network check the request header for Accept-Encoding like below, Accept-Encoding is highlighted you can see.

What does the Vary user agent HTTP header do?

The Vary HTTP header tells the browser that the contents of the response varies depending on the user agent that requests the page. If your server already uses the Vary HTTP header, you can add User-Agent to the list that's already served.

What is content encoding in response header?

The Content-Encoding representation header lists any encodings that have been applied to the representation (message payload), and in what order. This lets the recipient know how to decode the representation in order to obtain the original payload format.


2 Answers

I am getting nearly 100% score in https://tools.pingdom.com/ and https://developers.google.com/speed/pagespeed/insights/

I found a helpful post to speed up wordpress website or blog https://www.keycdn.com/blog/speed-up-wordpress/

With some other optimizations, I am also using below code on my site in .htaccess file (usually hidden in main website folder)

My Server is Apache, You can check in hosting control panel (Like cPanel/WHM Panel)(if your server is nginx check keycdn.com post)

(Copy and paste below code in .htaccess file, it's working good for me)

(Upvote this answer if works for you)

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 month"
ExpiresByType image/jpeg "access 1 month"
ExpiresByType image/gif "access 1 month"
ExpiresByType image/png "access 1 month"
ExpiresByType image/svg "access 1 month"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType text/javascript "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/xhtml+xml "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 month"
ExpiresDefault "access 1 month"
</IfModule>

<ifModule mod_headers.c>
  <filesMatch ".(css|jpg|jpeg|png|gif|swf|svg|js|ico)$">
    Header set Cache-Control "max-age=2592000, public"
  </filesMatch>
  <filesMatch ".(x?html?|php)$">
    Header set Cache-Control "private, must-revalidate"
  </filesMatch>
</ifModule>

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/json
  AddOutputFilterByType DEFLATE application/atom+xml
  AddOutputFilterByType DEFLATE application/rdf+xml
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-font-woff
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/truetype
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml
</IfModule>
like image 109
proseosoc Avatar answered Oct 24 '22 19:10

proseosoc


I think you have to enable compression for specific files like css, js and xml. The following code added to your domain's root .htaccess file will enable this kind of feature on you server:

<IfModule mod_headers.c>
  <FilesMatch "\.(js|css|xml|gz)$">
    Header append Vary: Accept-Encoding
  </FilesMatch>
</IfModule>

If you would like to add more file type to this rule, just simple add the its extension to the statement! <FilesMatch "\.(js|css|xml|gz|newone)$">

like image 20
Patartics Milán Avatar answered Oct 24 '22 20:10

Patartics Milán