How do you enable Apache to compress favicon?
FAILED - (11.6 KB, compressed = 5.7 KB - savings of 5.9 KB) - http://website/favicon.ico
Judging from your example, the fail is from the WebPagetest.
Add the line below to the file /etc/apache2/mods-enabled/deflate.conf (for Apache 2.2 on Ubuntu 12.04):
AddOutputFilterByType DEFLATE image/x-icon
Reload apache afterwards.
Here is my configuration for assets compression with Nginx :
gzip on;
gzip_min_length 1100;
gzip_buffers 4 32k;
gzip_types text/plain
application/x-javascript
text/xml
text/css
font/woff
application/font-woff
font/truetype
font/opentype
font/eot
application/vnd.ms-fontobject
image/svg+xml
image/x-icon;
gzip_vary on;
You could use imagemagick to compress the ico file:
compress -color 16 PATHTOORIGINAL/file.ico PATHTONEW/file.ico
Related
I'm trying to figure out why Nginx doesn't compress CSS. Nginx config looks valid and typical for the tasks like that.
Failed test:
curl -H "Accept-Encoding: gzip" -I https://<hostname>/sites/default/files/css/css_xLFDRTFqZTZeUg7Pab0gP4cpz5TWo3PCH-KBo_HKQ6A.css
HTTP/1.1 200 OK
Server: nginx
Content-Type: text/css
Content-Length: 1123
ETag: "587c4cdc-463"
Cache-Control: max-age=2592000
Accept-Ranges: bytes
The response Content-Encoding should be gzip instead of text/css.
Nginx config:
http {
...
gzip on;
gzip_buffers 16 8k;
gzip_comp_level 2;
gzip_http_version 1.1;
gzip_min_length 10240;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript image/x-icon application/vnd.ms-fontobject font/opentype application/x-font-ttf;
gzip_vary on;
gzip_proxied any;
gzip_disable msie6;
...
}
Your gzip_min_length is set too large - you can see the Content-Length in your request debug and its way less than the minimum threshold.
Remove that altogether or set it much lower.
If I ran gzip in CLI, I can get a good compression ratio:
bundle.js: 75.3% -- replaced with bundle.js.gz
But in Apache, even I set deflate, it did compress, but with same file size. Below is my Apache config:
LoadModule deflate_module libexec/apache2/mod_deflate.so
<IfModule deflate_module>
DeflateCompressionLevel 9
AddOutputFilterByType DEFLATE application/javascript text/plain text/css
CustomLog /var/log/deflate_log DEFLATE
</IfModule>
Below is the response:
ETag "8342b-53dc33d01d2c0-gzip"
Server Apache/2.4.23 (Unix)
Content-Type application/javascript
Last-Modified Sat, 01 Oct 2016 01:00:35 GMT
Date Sun, 02 Oct 2016 01:14:20 GMT
Connection Keep-Alive
Vary Accept-Encoding
Accept-Ranges bytes
Keep-Alive timeout=5, max=98
Content-Encoding gzip
Transfer-Encoding Identity
The network transfer size is same as before, and the ratio is 1.00x. I narrowed it down to only js get not compressed, instead css get good compression ratio of 6.22x. Is there something wrong with the js file?
I got it!
I noticed there is no "content-length" header in the response. So I went back to check Apache document. It says:
The DeflateBufferSize directive specifies the size in bytes of the
fragments that zlib should compress at one time. If the compressed
response size is bigger than the one specified by this directive then
httpd will switch to chunked encoding (HTTP header Transfer-Encoding
set to Chunked), with the side effect of not setting any
Content-Length HTTP header. This is particularly important when httpd
works behind reverse caching proxies or when httpd is configured with
mod_cache and mod_cache_disk because HTTP responses without any
Content-Length header might not be cached.
As my js file is 500k, much over the default 8k setting, so I added the following in conf file, now everything is good:
<IfModule deflate_module>
SetOutputFilter DEFLATE
AddOutputFilterByType DEFLATE application/javascript text/plain text/css
DeflateBufferSize 8096000
</IfModule>
I'm trying to set it up so that the browser will cache the webfonts for a long period and also attempting to gzip them for a faster download.
From what I can understand you can do this via your httpd.conf file in Apache or via .htaccess.
I'm not sure how to tell if gzip is enabled though, I read something about searching your httpd.conf file for DEFLATE; I did that, but found nothing - so not sure if it's enabled or not!?
Anyway, I have put this code below into the .htaccess file, partially because I didn't know where to put it in the httpd.conf file and partially because it's easier to make changes in .htaccess file without bothering my host continually.
Here is the code..
# Add correct content-type for fonts
AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType font/x-woff .woff
AddType image/svg+xml .svg
# Compress compressible fonts
AddOutputFilterByType DEFLATE font/ttf font/otf image/svg+xml
# Add a far future Expires header for fonts
ExpiresByType application/vnd.ms-fontobject "access plus 1 year"
ExpiresByType font/ttf "access plus 1 year"
ExpiresByType font/otf "access plus 1 year"
ExpiresByType font/x-woff "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
Now, I'm wondering if this is correct or not as I also seen this similar, but different code for the expiry..
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
Does it matter where you place it in the .htaccess file or can it go anywhere?
ExpiresByType can go in your httpd.conf, virtualhost config or htaccess, as shown in the apache documentation overview box at the top of each directive entry:
http://httpd.apache.org/docs/2.2/mod/mod_expires.html#expiresbytype
The Context listing is how you can tell which configuration files you can put your various Apache directive types into.
Assuming you are using PHP, your phpinfo details should tell you if gzip is enabled.
Edit
In response to your question about correct way MIME type for your fonts, in terms of their file association with the Apache Server, my mime.types file (found in apache conf folder where your httpd.conf lives) tells me that
application/x-font-(extension)
would be the association to use with ExpiresByType. I would suggest getting the fonts working first, and then checking the headers for the font url to see if its giving proper expiration date.
As for the browsers receiving the web fonts, this article seems to indicate that MIME types aren't considered and thus don't matter. But yet this one seems to contradict that. As I understand it, there is no official font/ MIME type so any browser implementation is outside the MIME specifications.
Related questions:
Proper MIME type for fonts
Correct Apache AddType directives for font MIME types
I've not seen anything specifying placement requirements in .htaccess so you should be safe putting these rules wherever you see fit, although if you do AddTypes you need to do so above any further directives that reference that declared Type. It's probably best to put these near the top above your rewrite rules.
I have a strange issue whereby including the following syntax in my Apache 2.4.1 httpd.conf causes "502 Bad Gateway" errors when retrieving swf files via HAproxy:
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/x-javascript text/javascript
When I remove this config line the 502 Bad Gateway error goes away.
The server returns these response headers on a successful request:
Date: Wed, 11 Apr 2012 20:24:12 GMT
Server: Apache
Connection: close
Transfer-Encoding: chunked
Content-Type: text/html; charset=utf-8
200 OK
I fixed this by updating to Apache 2.4.2 (there was a mod_deflate seg fault bug in 2.4.1) and adding:
Header append Vary User-Agent
Beneath the AddOutputFilterByType line.
I can see output stats with mod_pagespeed but it does not seam to be doing anything (all stats values stay at 0).
serf_fetch_request_count: 0
serf_fetch_bytes_count: 0
serf_fetch_time_duration_ms: 0
serf_fetch_cancel_count: 0
Anyone knows what can be going wrong?
Ok, I was able to found the blaming lines on my config:
// does NOT work with mod_pagespeed
<FilesMatch "\.(js|css|html|htm|php|xml)$">
SetOutputFilter DEFLATE
</FilesMatch>
So if you have some fancy DEFLATE options, disable them. On the other hand the below code works.
// does WORK with mod_pagespeed
AddOutputFilterByType DEFLATE text/html text/plain text/xml font/
opentype font/truetype font/woff