How to use gzip and http2 at the same time? - .htaccess

I'm doing webgl and use .ktx, a format extremly heavy when not gzipped.
The result of the loading size using http2 or http1.1 :
https + http2 : 98mo, gzip doesnt work
http + http1.1 : 12mo, gzip work.
I was wondering if it was possible to use gzip and http2 at the same time?
In case, here my .htaccess ( relevant part ) :
<IfModule mod_mime.c>
AddType model/gltf+json .gltf
AddType image/ktx .ktx
</Ifmodule>
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE "model/gltf+json" \
"image/ktx"
</IfModule>

There is nothing to stop you using gzip and http2 at the same time.
I can only guess you have the mod_deflate config only setup in your http vhost and not the https vhost.

Related

gzipping my site doesn't seem to work using htaccess - no Content-Encoding: gzip

I'm trying to gzip my site. But I'm not sure if it's actually working..
When I'm checking at checkgzipcompression.com, WhatsMyIP.org and YSlow - they all tell me that the site is not compressed. Yslow also tells me that I have a couple of files that is not compressed, and of course suggest I do so.
This is the part, in my htaccess-file, that should compress the site:
<IfModule mod_deflate.c>
# Force compression for mangled headers.
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
</IfModule>
</IfModule>
# Compress all output labeled with one of the following MIME-types
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE application/atom+xml \
application/javascript \
application/json \
application/rss+xml \
application/vnd.ms-fontobject \
application/x-font-ttf \
application/x-web-app-manifest+json \
application/x-httpd-php \
application/x-httpd-fastphp \
application/xhtml+xml \
application/xml \
font/opentype \
image/svg+xml \
image/x-icon \
text/css \
text/html \
text/plain \
text/x-component \
text/xml
</IfModule>
</IfModule>
This code is based on h5bp (https://github.com/h5bp/html5-boilerplate/blob/v4.3.0/doc/TOC.md).
If I add ini_set("zlib.output_compression", 4096); to the PHP initiation script - both checkgzipcompression.com and WhatsMyIP.org tells me that my site is compressed. Along with the page weight in kb.
But YSlow still tells me that I have multiple files that is not compressed.
And in developer tools for both chrome and firefox shows the uncompressed filesize for each request/file (I'm not sure if that's how it suppose to be though(?)).
It does say Accept-Encoding: gzip,deflate, and Vary: Accept-Encoding, but nothing like Content-Encoding: gzip.
I just had a chat with my server provider -- BlueHost -- and they said that mod_deflate runs automatically on all of their servers. But since it's dynamic, most website scanners don't see it.
The conclution was that it's not possible for me to actually be sure that my site is in fact compressed.
The .htaccess-file is as it's shown above, and zlib.output_compression() is turned off - in case you have the ability to check it out..
The domain is: http://barkeeper.thomaskile.me
Here's a acreenprint of what firefox has to say about the page:
Same issue with Bluehost. I checked the actual file sizes and they are not compressed. Got the same BS that it automatic. First they tried telling me it only worked when the server was under a heavy load... apparently that person was clueless. Then I was told the server load threshold was low, and that compression was disabled when that threshold was exceeded. I am quite upset with these answers being all over the place.

Responding to google page speed suggestion regarding compression

Google page speed tool tells me this: "Compressing resources with gzip or deflate can reduce the number of bytes sent over the network"
and of course lists all my .js and .css files.
Researching here eventually led me to this question:
How to Specify "Vary: Accept-Encoding" header in .htaccess
Which seems to say that for just .js and .css files all I would need to do is this:
<IfModule mod_deflate.c>
#The following line is enough for .js and .css
AddOutputFilter DEFLATE js css
</IfModule>
<IfModule mod_headers.c>
<FilesMatch "\.(js|css)$">
Header append Vary: Accept-Encoding
</FilesMatch>
</IfModule>
Can someone confirm that this is the current "best practice" for this objective and that it is failsafe, assuming the user is on a modern browser (e.g. not < IE7 for example)
Thanks!

Htaccess Concatenarion

I use this code to concatenare CSS and Javascript:
<FilesMatch "\.combined\.js$">
Options +Includes
AddOutputFilterByType INCLUDES application/javascript application/json
SetOutputFilter INCLUDES
</FilesMatch>
<FilesMatch "\.combined\.css$">
Options +Includes
AddOutputFilterByType INCLUDES text/css
SetOutputFilter INCLUDES
</FilesMatch>
but it doesnt work
So you're using
<!--#include file="path/to/a/file.js" -->
<!--#include file="path/to/another/file.js" -->
in a master JS or CSS file, right?
This is what is being enabled by the .htaccess code posted in your question.
I also used same code for concatenating my js and css file. It works pefectly in my local machine..but don't work in live. I am using ubutu linux server.

How to Specify "Vary: Accept-Encoding" header in .htaccess

Google PageSpeed says I should "Specify a Vary: Accept-Encoding header" for JS and CSS. How do I do this in .htaccess?
I guess it's meant that you enable gzip compression for your css and js files, because that will enable the client to receive both gzip-encoded content and a plain content.
This is how to do it in apache2:
<IfModule mod_deflate.c>
#The following line is enough for .js and .css
AddOutputFilter DEFLATE js css
#The following line also enables compression by file content type, for the following list of Content-Type:s
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml
#The following lines are to avoid bugs with some browsers
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>
And here's how to add the Vary Accept-Encoding header: [src]
<IfModule mod_headers.c>
<FilesMatch "\.(js|css|xml|gz)$">
Header append Vary: Accept-Encoding
</FilesMatch>
</IfModule>
The Vary: header tells the that the content served for this url will vary according to the value of a certain request header. Here it says that it will serve different content for clients who say they Accept-Encoding: gzip, deflate (a request header), than the content served to clients that do not send this header. The main advantage of this, AFAIK, is to let intermediate caching proxies know they need to have two different versions of the same url because of such change.
I'm afraid Aularon didn't provide enough steps to complete the process. With a little trial and error, I was able to successfully enable Gzipping on my dedicated WHM server.
Below are the steps:
Run EasyApache within WHM, select Deflate within the Exhaustive Options list, and rebuild the server.
Once done, goto Services Configuration >> Apache Configuration >> Include Editor >> Post VirtualHost Include, select All Versions, and then paste the mod_headers.c and mod_headers.c code (listed above in Aularon's post) on top of on another within the input field.
Once saved, I was seeing a 75.36% data savings on average! You can run a before and after test by using this HTTP Compression tool to see your own results: http://www.whatsmyip.org/http_compression/
Hope this works for you all!
Matt
To gzip up your font files as well!
add "x-font/otf x-font/ttf x-font/eot"
as in:
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml x-font/otf x-font/ttf x-font/eot
This was driving me crazy, but it seems that aularon's edit was missing the colon after "Vary". So changing "Vary Accept-Encoding" to "Vary: Accept-Encoding" fixed the issue for me.
I would have commented below the post, but it doesn't seem like it will let me.
Anyhow, I hope this saves someone the same trouble I was having.
Many hours spent to clarify what was that. Please, read this post to get the advanced .HTACCESS codes and learn what they do.
You can use:
Header append Vary "Accept-Encoding"
#or
Header set Vary "Accept-Encoding"
if anyone needs this for NGINX configuration file here is the snippet:
location ~* \.(js|css|xml|gz)$ {
add_header Vary "Accept-Encoding";
(... other headers or rules ...)
}
No need to specify or even check if the file is/has compressed,
you can send it to every file, On every request.
It tells downstream proxies how to match future request headers to decide
whether the cached response can be used rather than requesting a fresh
one from the origin server.
<ifModule mod_headers.c>
Header unset Vary
Header set Vary "Accept-Encoding, X-HTTP-Method-Override, X-Forwarded-For, Remote-Address, X-Real-IP, X-Forwarded-Proto, X-Forwarded-Host, X-Forwarded-Port, X-Forwarded-Server"
</ifModule>
the unset is to fix some bugs in older GoDaddy hosting, optionally.

Dreamweaver and GZIP files

I've recently tried to optimize my site for speed and brandwith. Amongst many other techniques, I've used GZIP on my .css and .js files.
Using PuTTY I compressed the files on my site and then used:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Konqueror
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)\.css$ $1.css.gz [QSA,L]
RewriteRule ^(.*)\.js$ $1.js.gz [QSA,L]
<FilesMatch \.css\.gz$>
ForceType text/css
</FilesMatch>
<FilesMatch \.js\.gz$>
ForceType text/javascript
</FilesMatch>
</IfModule>
<IfModule mod_mime.c>
AddEncoding gzip .gz
</IfModule>
in my .htaccess file so that they get served properly because all my links are without the ".gz".
My problem is, I cant work on the GZIP file in Dreamweaver. Is there a plugin or extension of somesort that allows Dreamweaver to temporarily uncompress thses files so it can read them?
Or is there a way that I can work on my local copies as regular files, and server side they automatically get compressed when they are uploaded.
Or is there a different code editor I should be using that would completely get around this?
Or a just a different technique to doing this?
I hope this question makes sense,
Thanks
Dreamweaver do not have the capability built in to natively work with zipped or gzipped files. After you pull down a file from your server, you would need to extract the file(s), make your edits, and then re-pack the file(s) to upload them. If you do not have an application locally to do this, I'd suggest: 7-Zip: http://7-zip.org/
A server side solution could also be used, but I guess that you'd have to have a caching mechanism on the sever that would first check if a newer version of a file exists, if it does then gzip it, if not move on to serving the file. Perhaps ask a new question specific to gzip files to serve using the server language of your choice, I'm sure there are a number of solutions out there.

Resources