Enable GZIP for CSS and JS files on NGINX server for Magento
MagentoNginxGzipMagento Problem Overview
I need to enable gzip compression on nginx server. As I have observed from firfox firebug NET tools, I have found that html file are gzip compressed. But Not the javascript files and CSS files.
I have already check Mime.types and nginx configuration file /etc/nginx/ngnix.conf and not found any issue. still not able to see the css and javascript Gzip Compression. My NGINX.conf entries are as below
gzip on;
gzip_disable "msie6";
gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
Magento Solutions
Solution 1 - Magento
This is an working config that I currently use in production.
gzip on;
gzip_disable "msie6";
gzip_comp_level 6;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_proxied any;
gzip_types
text/plain
text/css
text/js
text/xml
text/javascript
application/javascript
application/json
application/xml
application/rss+xml
image/svg+xml;
This config was tested via tools.pingdom.com.
Solution 2 - Magento
You can find example configuration from the html5 boilerplate code.
Enable Gzip
gzip on; gzip_http_version 1.0; gzip_comp_level 2; gzip_min_length 1100; gzip_buffers 4 8k; gzip_proxied any; gzip_types # text/html is always compressed by HttpGzipModule text/css text/javascript text/xml text/plain text/x-component application/javascript application/json application/xml application/rss+xml font/truetype font/opentype application/vnd.ms-fontobject image/svg+xml;
gzip_static on;
gzip_proxied expired no-cache no-store private auth; gzip_disable "MSIE [1-6]."; gzip_vary on;
Solution 3 - Magento
If some of your files are compressed and some are not, then your gzip is working but you might have missed definition in gzip_types. For example, javascript files may return in headers any of following type:
- application/javascript
- application/x-javascript
- text/javascript
To compress all javascript files, all three definitions should be included in gzip_types.
You need to check in response headers what content-type is returned for such an uncompressed file and then make sure it is also defined in gzip_types.
Solution 4 - Magento
Are your gzip entries within the nginx configuration "scope" that js,css,etc. assets are being served? I ask because if you're using some sort of a framework, sometimes there are different location {...} blocks that handle html requests vs assets.
Also when you're testing in a browser, make sure you do a hard refresh to force the server to give you a "fresh copy" of whatever you're looking at.
Finally, you can use gzip_types * to allow anything to be gzipped. Perhaps someone else can chime in if this is a good practice or not.
Solution 5 - Magento
To compress SVG, this line is correct:
image/svg+xml svg svgz;