Gzip is a compression technology frequently used for transferring data quickly over the internet. It compresses HTTP content before it’s served to a client.
Free to Use and Open Source
GZIP Compression is the simple & most effective way to speed up your site.
It reduces the content by up to 80 percent resulting in improved page load time, decreased bandwidth consumption and reduced SSL overhead.
Why Gzip?
When you request a file like Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos , your browser talks to a web server. The conversation goes a little like this:
Browser: Hey, GET me /index.html
Server: Ok, let me see if index.html is lying around…
Server: Found it! Here’s your response code (200 OK) and I’m sending the file.
Browser: 100KB? Ouch… waiting, waiting… ok, it’s loaded.
So what’s the problem?
Well, the system works, but it’s not that efficient. 100KB is a lot of text, and frankly, HTML is redundant. Every <html>, <table> and <div> tag has a closing tag that’s almost the same. Words are repeated throughout the document. Any way you slice it, HTML is not lean.
And what’s the plan when a file’s too big? Zip it!
If we could send a .zip file to the browser (index.html.zip) instead of plain old index.html, we’d save on bandwidth and download time. The browser could download the zipped file, extract it, and then show it to user. The browser-server conversation might look like this:
Browser: Hey, can I GET index.html? I’ll take a compressed version if you’ve got it.
Server: Let me find the file… yep, it’s here. And you’ll take a compressed version? Awesome.
Server: Ok, I’ve found index.html (200 OK), am zipping it and sending it over.
Browser: Great! It’s only 10KB. I’ll unzip it and show the user.
The formula is simple: Smaller file = faster download = happy user.
The (not so) hairy details
The tricky part of this exchange is the browser and server knowing it’s ok to send a zipped file over. The agreement has two parts
The browser sends a header telling the server it accepts compressed content (gzip and deflate are two compression schemes): Accept-Encoding: gzip, deflate
LUMEN APIWEB ApplicationThe server sends a response if the content is actually compressed: Content-Encoding: gzip
If the server doesn’t send the content-encoding response header, it means the file is not compressed (the default on many servers). The “Accept-encoding” header is just a request by the browser, not a demand. If the server doesn’t want to send back compressed content, the browser has to make do with the heavy regular version.
How to Check If GZIP Compression Is Enabled
The Accept-Encoding: gzip, deflate HTTP header is supported by effectively all modern browsers. Hence, most web hosts, including Kinsta, enable GZIP compression by default on all their servers.
When web servers see this header sent by a browser, they recognize the browser’s support for GZIP and respond with a compressed HTTP response using content-encoding: gzip header.
Below are a few straightforward ways to check for GZIP compression.
Online GZIP Compression Test Tools
Using an online tool is the easiest way to check if GZIP compression is enabled on your website. I recommend using the free Check GZIP Compression or HTTP Compression Test tools. Simply enter your website URL and hit the Check or Test button.The “content-encoding: gzip” HTTP Response Header
The second way to verify whether a website delivers GZIP compressed content is by verifying the content-encoding: gzip HTTP response header.
Browser Support
The “good news” is that we can’t control the browser. It either sends the Accept-encoding: gzip, deflate header or it doesn’t.
Our job is to configure the server so it returns zipped content if the browser can handle it, saving bandwidth for everyone.
How to Enable GZIP Compression
Enable specific modules on Apache Server:
To enable GZIP compression on Apache servers, you need to use its mod_filter and mod_deflate modules and configure them properly with the right directives. They will direct Apache to compress server output before sending it to clients over the network.
Note : Most web hosts have it enabled by default.
LoadModule deflate_module modules/mod_deflate.so
LoadModule filter_module modules/mod_filter.soApache Server configuration
You have two options to edit Apache’s server configs based on the access level you have:
Option 1: Main server configuration
If you can access the main server configuration file (usually called httpd.conf), you’re recommended to use it to configure Apache as .htaccess files can slow down Apache..
You can add the below scripts to either httpd.conf file or a cutomized conf file (gzip.conf) file and restart apache server
/etc/httpd/conf.d/gzip.conf [OR] .htaccess
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>Customized based on requirement: /etc/httpd/conf.d/gzip.conf
<IfModule mod_deflate.c>
# force compression for clients that mangle 'Accept-Encoding' request 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 with one of the following file extensions
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE "application/atom+xml" \
"application/javascript" \
"application/json" \
"application/ld+json" \
"application/manifest+json" \
"application/rdf+xml" \
"application/rss+xml" \
"application/schema+json" \
"application/geo+json" \
"application/vnd.ms-fontobject" \
"application/wasm" \
"application/x-font-ttf" \
"application/x-javascript" \
"application/x-web-app-manifest+json" \
"application/xhtml+xml" \
"application/xml" \
"font/eot" \
"font/opentype" \
"font/otf" \
"font/ttf" \
"image/bmp" \
"image/svg+xml" \
"image/vnd.microsoft.icon" \
"text/cache-manifest" \
"text/calendar" \
"text/css" \
"text/html" \
"text/javascript" \
"text/plain" \
"text/markdown" \
"text/vcard" \
"text/vnd.rim.location.xloc" \
"text/vtt" \
"text/x-component" \
"text/x-cross-domain-policy" \
"text/xml"
</IfModule>
# define and map media types to their appropriate encoding type
# Using SVG format (Scalable Vector Graphics) is highly recommended to
# load logos, icons, text, and simple images. You can compress .SVG files
# further using GZIP to create .SVGZ files. However, most browsers don’t
# know that they need to decompress them first if they’re not served
# without an appropriate ‘content-encoding’ HTTP response header. Thus,
# these images wouldn’t show up in the browser. Hence, this module.
<IfModule mod_mime.c>
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
</IfModule>
</IfModule>
Ex: On the codebase for Amazon Linux 2
Option 2: Using .htaccess file
If you can’t access the main server configuration file, which is usually the case with most WordPress shared hosting providers, then you need to configure Apache using the .htaccess file.
.htaccess
<IfModule mod_deflate.c>
# force compression for clients that mangle 'Accept-Encoding' request 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 with one of the following file extensions
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE "application/atom+xml" \
"application/javascript" \
"application/json" \
"application/ld+json" \
"application/manifest+json" \
"application/rdf+xml" \
"application/rss+xml" \
"application/schema+json" \
"application/geo+json" \
"application/vnd.ms-fontobject" \
"application/wasm" \
"application/x-font-ttf" \
"application/x-javascript" \
"application/x-web-app-manifest+json" \
"application/xhtml+xml" \
"application/xml" \
"font/eot" \
"font/opentype" \
"font/otf" \
"font/ttf" \
"image/bmp" \
"image/svg+xml" \
"image/vnd.microsoft.icon" \
"text/cache-manifest" \
"text/calendar" \
"text/css" \
"text/html" \
"text/javascript" \
"text/plain" \
"text/markdown" \
"text/vcard" \
"text/vnd.rim.location.xloc" \
"text/vtt" \
"text/x-component" \
"text/x-cross-domain-policy" \
"text/xml"
</IfModule>
# define and map media types to their appropriate encoding type
# Using SVG format (Scalable Vector Graphics) is highly recommended to
# load logos, icons, text, and simple images. You can compress .SVG files
# further using GZIP to create .SVGZ files. However, most browsers don’t
# know that they need to decompress them first if they’re not served
# without an appropriate ‘content-encoding’ HTTP response header. Thus,
# these images wouldn’t show up in the browser. Hence, this module.
<IfModule mod_mime.c>
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
</IfModule>
</IfModule>Compare after and before Gzip compression :
Lumen API
Web App.
Advantages
Compressing content helps with decreasing the time it will take for clients to download.
It saves your bandwidth so it reduces costs!
Disadvantages
Compressing contents eats your server’s CPU cycles!
Decompressing eats your client's CPU cycles as well
Presentation :
Reference :
How to Enable GZIP Compression to Speed Up WordPress Sites
server-configs-apache/.htaccess at main · h5bp/server-configs-apache
