Gzip compression in Nginx - Step-by-Step Execution

Process Flow - Gzip compression

Client sends HTTP request

↓

Nginx receives request

↓

Check if gzip is enabled?

No→Send response uncompressed

Yes↓

Compress response with gzip

↓

Add Content-Encoding: gzip header

↓

Send compressed response to client

Nginx checks if gzip compression is enabled for the response. If yes, it compresses the response and adds the proper header before sending it to the client.

Execution Sample

Nginx

gzip on;
gzip_types text/plain application/json;

location / {
  proxy_pass http://backend;
}

This config enables gzip compression for text and JSON responses proxied to the backend.

Process Table

Step	Action	Condition	Result	Response Header	Response Body
1	Receive client request	N/A	Request accepted	N/A	N/A
2	Check gzip setting	gzip on?	Yes	N/A	N/A
3	Check content type	Is content type in gzip_types?	Yes (application/json)	N/A	N/A
4	Compress response	N/A	Response compressed	Content-Encoding: gzip	Compressed data
5	Send response	N/A	Compressed response sent	Content-Encoding: gzip	Compressed data
6	End	N/A	Request complete	N/A	N/A

💡 Nginx sends compressed response because gzip is enabled and content type matches gzip_types.

Status Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
gzip	off	on	on	on	on
content_type	unknown	unknown	application/json	application/json	application/json
response_compressed	false	false	false	true	true
response_header	none	none	none	Content-Encoding: gzip	Content-Encoding: gzip

Key Moments - 3 Insights

Why does nginx only compress some responses and not all?

Nginx compresses only if gzip is enabled and the response content type matches the types listed in gzip_types, as shown in steps 2 and 3 of the execution_table.

What happens if gzip is off in the config?

If gzip is off, nginx skips compression and sends the response uncompressed, as the flow exits at step 2 in the execution_table.

Why is the Content-Encoding header important?

It tells the client the response is compressed with gzip, so the client knows to decompress it. This header is added in step 4 of the execution_table.

Visual Quiz - 3 Questions

Look at the execution_table, at which step does nginx decide to compress the response?

A Step 2

B Step 3

C Step 4

D Step 5

💡 Hint

Check the 'Condition' column where nginx checks content type before compressing.

According to variable_tracker, what is the value of response_compressed after step 3?

A unknown

B true

C false

D none

💡 Hint

Look at the 'response_compressed' row under 'After Step 3' column.

If gzip was set to off, how would the execution_table change?

A Step 2 would show 'No' and skip compression steps

B Step 4 would compress anyway

C Content-Encoding header would still be added

D Response body would be compressed but header missing

💡 Hint

Refer to step 2 where gzip setting is checked to decide compression.

Concept Snapshot

Nginx gzip compression:
- Enable with 'gzip on;'
- Specify types with 'gzip_types'
- Compresses matching responses
- Adds 'Content-Encoding: gzip' header
- Saves bandwidth and speeds up delivery

Full Transcript

This visual execution shows how nginx handles gzip compression. When a client sends a request, nginx checks if gzip is enabled. If yes, it checks if the response content type matches the configured gzip_types. If both conditions are true, nginx compresses the response body using gzip and adds the 'Content-Encoding: gzip' header. Then it sends the compressed response to the client. Variables like gzip status, content type, and response compression state change step-by-step. Key moments clarify why only some responses are compressed and the role of the header. The quiz tests understanding of when compression happens and variable states.

Practice

1. What is the main purpose of enabling gzip compression in nginx?

easy

A. To block certain file types from being served

B. To increase the server's CPU usage for better performance

C. To encrypt data between server and client

D. To reduce the size of files sent to the browser, speeding up page load

Solution

1. Step 1: Understand gzip compression purpose

   Gzip compresses files to reduce their size before sending to the browser.

2. Step 2: Connect compression to page load speed

   Smaller files load faster, improving website speed and user experience.

3. Final Answer:

   To reduce the size of files sent to the browser, speeding up page load -> Option D

4. Quick Check:

   gzip compression = smaller files = faster load [OK]

Hint: Remember gzip shrinks files to speed up loading [OK]

Common Mistakes:

• Thinking gzip increases CPU for performance
• Confusing gzip with encryption
• Believing gzip blocks files

2. Which of the following is the correct way to enable gzip compression in nginx configuration?

easy

A. gzip on;

B. gzip enable;

C. enable gzip;

D. gzip true;

Solution

1. Step 1: Recall nginx gzip syntax

   The correct directive to enable gzip is gzip on;.

2. Step 2: Check other options for syntax errors

   Options A, C, and D use invalid keywords or syntax not recognized by nginx.

3. Final Answer:

   gzip on; -> Option A

4. Quick Check:

   Enable gzip with 'gzip on;' [OK]

Hint: Use exact directive 'gzip on;' to enable gzip [OK]

Common Mistakes:

• Using 'gzip enable;' instead of 'gzip on;'
• Writing 'enable gzip;' which is invalid
• Using 'gzip true;' which is not recognized

3. Given this nginx snippet:

gzip on;
gzip_types text/plain application/json;

Which file types will be compressed when served?

medium

A. All file types are compressed

B. Only text/plain and application/json files

C. No files are compressed because gzip_types is incomplete

D. Only binary files are compressed

Solution

1. Step 1: Analyze gzip_types directive

   The directive specifies only text/plain and application/json MIME types for compression.

2. Step 2: Understand gzip on directive effect

   With gzip on;, only the listed types in gzip_types are compressed.

3. Final Answer:

   Only text/plain and application/json files -> Option B

4. Quick Check:

   gzip_types limits compression to listed types [OK]

Hint: gzip_types controls which file types get compressed [OK]

Common Mistakes:

• Assuming all files compress by default
• Thinking gzip_types must list all types including binaries
• Believing gzip_types disables compression

4. You added gzip on; and gzip_types text/html; to nginx.conf but compression is not working. What is the likely mistake?

medium

A. Enabling gzip disables compression by default

B. Using gzip_types with only one type

C. Forgetting to reload nginx after config change

D. Missing gzip_disable directive

Solution

1. Step 1: Check nginx reload requirement

   After config changes, nginx must be reloaded to apply new settings.

2. Step 2: Evaluate other options

   Using one type in gzip_types is valid; gzip on enables compression; gzip_disable disables it for some clients but is optional.

3. Final Answer:

   Forgetting to reload nginx after config change -> Option C

4. Quick Check:

   Reload nginx to apply gzip changes [OK]

Hint: Always reload nginx after config edits [OK]

Common Mistakes:

• Not reloading nginx after config update
• Thinking gzip_types must list many types
• Confusing gzip_disable as required

5. You want to compress HTML, CSS, and JavaScript files in nginx. Which configuration snippet correctly enables gzip for these types?

hard

A. gzip on;\ngzip_types text/html text/css application/javascript;

B. gzip on;\ngzip_types html css js;

C. gzip enable;\ngzip_types text/html text/css application/javascript;

D. gzip on;\ngzip_types text/html text/css js;

Solution

1. Step 1: Verify gzip enabling syntax

   The correct directive to enable gzip is gzip on;, not gzip enable;.

2. Step 2: Check MIME types in gzip_types

   File types must be specified by their MIME types: text/html, text/css, and application/javascript. Using extensions like 'html', 'css', or 'js' is invalid.

3. Final Answer:

   gzip on;\ngzip_types text/html text/css application/javascript; -> Option A

4. Quick Check:

   Use 'gzip on;' and correct MIME types [OK]

Hint: Use MIME types, not file extensions, in gzip_types [OK]

Common Mistakes:

• Using 'gzip enable;' instead of 'gzip on;'
• Listing file extensions instead of MIME types
• Omitting JavaScript MIME type