HTTP compression is concerned with the application of different algorithms to the amount of data that has to be sent out from the server, the amount of data that has to come to the client in order to make further relations as efficient as possible. It is mostly beneficial when it comes to documents like HTML or CSS and JavaScript texts but mostly avoided when it comes to media files like videos or pictures that and have already been compressed.
These are the following topics that we are going to explore:
File format compression means the various techniques employed in compressing the file size. When it comes to web applications, it is observed that the file format compression that is most widely used are Gzip and Brotli. These formats effectively and efficiently result to the reduction of filesin and efficient data without affecting the content of the data.
- Gzip: This is one of the most widely supported text file compression algorithms aimed primarily at transmitting texts and which quickly brings down file size in preparation for increased and quicker loading times.
- The deciding factor is that its newer feature versions therefore feature a thatsmarter standard and even better compression. Brotli is useful, for files, especially with larger files as it gives greater comps than the other ideas. Some older version of browsers may not support Brotli though.
Loss-less Compression
Loss-less compression is the most widely used method of stating that the actual file is being reduced and no information is being lost towards regular editing. It is possible to restore the compressed data to its past state. This type of compression is most preferred for text content such as HTML CSS JavaScript code among others so that no data is lost during transmission.
Example: Gzip is a common loss-less compression format used on web servers. It reduces file size without losing any data.
Lossy Compression
Lossy compression permanently removes some data to reduce file size further. This method is commonly used for media files like images, audio, and video, where perfect accuracy is not critical, and slight data loss is acceptable to reduce file size significantly.
Example: JPEG compression for images and MP3 compression for audio are forms of lossy compression.
End-to-End Compression
End to end compression means that the data is compressed at the source, and then the compressed data is sent to the end user where it is manipulated.
How it works:
The server packs files, then ships them to the client, wherein the client’s browser expands them.
Hop-by-Hop Compression
Hop-by-hop compression involves compressing data between individual nodes along the transmission path (e.g., routers or intermediaries). Some data is compressed and expanded several times before reaching the last consumer – the client, and hence this technique is seldom used in HTTP compression because of its intricacies and more processing resources that are required.
How it works:
One node compresses the data and the other decompresses the data, which is done in a repetitive manner until the last node is reached.
File Compression on Web Servers
To enable Gzip compression of HTML, CSS and JavaScript files from Apache server, insert the following snippet in the .htaccess file:
1. Apache (Gzip)
To enable Gzip compression, you need to add the following configuration to your .htaccess file or server configuration file:
//bash
<IfModule mod_deflate.c>
# Enable Gzip compression for specific file types
AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/javascript
</IfModule>
2. Nginx (Gzip)
For enabling Gzip compression in Nginx, the configuration looks like this in nginx.conf:
//bash
gzip on;
gzip_types text/css application/javascript text/plain application/xml;
gzip_min_length 1000; # Only compress files larger than 1000 bytes
In IIS, compression is enabled via the IIS Manager:
- Open IIS Manager.
- Select the server or website, then navigate to Compression.
- Enable Static and Dynamic Content Compression by checking the respective boxes.
Example of HTTP Compression in Apache (Gzip)
To compress HTML, CSS, and JavaScript files using Gzip in an Apache server, add the following to the .htaccess file:
//bash
<IfModule mod_deflate.c>
# Compress HTML, CSS, JS files
AddOutputFilterByType DEFLATE text/html text/css application/javascript
</IfModule>
- After saving and restarting the server, visit your website. The browser will now automatically request compressed files from the server.
You can verify the compression by using browser developer tools (under the “Network” tab). Look for the Content-Encoding response header which will indicate the compression type, such as gzip.
How HTTP Compression Works
HTTP compression needs web clients (browsers) and web servers to cooperate with each other. Below will provide a detailed flow of the process:
1. Client Request
Each time a browser requests for a resource (a web page for instance), it attaches an Accept-Encoding header which is a list of allowable encodings.
//bash
Accept-Encoding: gzip, deflate, br
2. Server Response
When the browser fetches some resources, it looks up this list in the Accept-Encoding header coming from the user, which was specified by the user’s browser, and selects the appropriate one.
//bash
Content-Encoding: gzip
3. Decompression
The browser receives the compressed response and decompresses it before displaying the content to the user. This decompression process happens automatically, and the user doesn't need to do anything.
Compression typically reduces the file size by 70-90%, resulting in faster load times and lower bandwidth usage. Modern browsers and servers support various compression methods, with Gzip and Brotli being the most popular.
Conclusion
HTTP compression is a very important and powerful component of achieving the best possible web related tasks that is makes the web pages to load very efficiently by using very little amount of web space. This is not only an advantage with regard to the time it takes to load the page but also in conserving the bandwidth of the website thus benefiting its users who have poor internet connections. Once the compression is implemented, the level of satisfaction of the users can be highly increased with no changes made on the actual usability of the site.
Similar Reads
HTTP headers | Connection
The HTTP Connection header is a general type header that allows the sender or client to specify options that are desired for that particular connection. Instead of opening a new connection for every single request/response, Connection helps in sending or receiving multiple HTTP requests/responses us
2 min read
HTTP headers | expires
The HTTP Expires header is a response-type header, the fundamental way of controlling the caches present. The expire header contains the date and time which denotes the period where the object can stay alive. Once the period expires, the object becomes stale. Almost every client support expire heade
2 min read
A Typical HTTP Session
In web communications, Hypertext Transfer Protocol (HTTP) is the cornerstone of data exchange between clients (typically web browsers) and servers. An HTTP session represents the lifecycle of the single request-response cycle between these two entities. Let us explore the steps involved in a typical
5 min read
HTTP headers | Accept
The HTTP Accept header is a request type header. The Accept header is used to inform the server by the client that which content type is understandable by the client expressed as MIME-types. By using the Content-negotiation the server selects a proposal of the content type and informs the client of
2 min read
HTTP headers | Cookie
HTTP headers are used to pass additional information with HTTP response or HTTP requests. A cookie is an HTTP request header i.e. used in the requests sent by the user to the server. It contains the cookies previously sent by the server using one or more set-cookie headers. It is an optional header.
1 min read
JSP - HTTP Status Codes
When the Client makes any requests to the server, the Status Codes are issued by the server as a response to the client's request. So, in an application, we have the client and the server architecture. The server is the part that holds the particular web service or an API. The client is the actor wh
4 min read
HTTP headers | Host
The HTTP Host represents the domain name of the server. It may also represent the Transmission Control Protocol (TCP) port number which the server uses. Defining the port number is optional, the default value is considered. For example, "80" is assigned as the port number for an HTTP URL when there
1 min read
HTTP Flood Attack
Cyber crimes are increasing with the growing demand for the internet. With an increasing number of cybercrime cases reported each year, awareness of cyberattacks is very important. Cyber crimes/cyberattacks are done by hackers who unethically want to breach user data and steal sensitive information
9 min read
HTTP headers | Authorization
The HTTP headers Authorization header is a request type header that used to contains the credentials information to authenticate a user through a server. If the server responds with 401 Unauthorized and the WWW-Authenticate header not usually. Syntax: Authorization: <type> <credentials>
1 min read
HTTP headers | Forwarded
HTTP headers allow client and server to pass supplementary information with an HTTP request or HTTP response. Headers can be classified according to their context. General headers contain information about both request and response but no relation with the data being transmitted. Request headers con
2 min read