Nginx

Gzip Compression ใน Nginx — เพิ่มความเร็วเว็บไซต์

ความเร็วของเว็บไซต์เป็นปัจจัยสำคัญที่มีผลต่อประสบการณ์ผู้ใช้และการจัดอันดับใน Google ปัญหาหนึ่งที่ทำให้เว็บไซต์โหลดช้า คือ ขนาดของไฟล์ที่ต้องส่งจากเซิร์ฟเวอร์ไปยังเบราวเซอร์ผู้ใช้ วิธีแก้ไขที่มีประสิทธิภาพคือการใช้ Gzip Compression ซึ่งจะบีบอัดไฟล์ให้มีขนาดเล็กลง ทำให้สามารถส่งข้อมูลได้เร็วขึ้นและประหยัดแบนด์วิดท์ได้มากกว่า 80%

Nginx เป็น web server ยอดนิยมที่รองรับการตั้งค่า Gzip Compression อย่างมีประสิทธิภาพ บทความนี้จะอธิบายวิธีการตั้งค่า Gzip ใน Nginx เพื่อให้เว็บไซต์ของคุณทำงานได้อย่างรวดเร็ว และสอนวิธีการทดสอบเพื่อให้มั่นใจว่าระบบบีบอัดทำงานอย่างเหมาะสม

Gzip Compression คืออะไร

Gzip (GNU zip) เป็นรูปแบบการบีบอัดไฟล์ที่ใช้ลอการิทึม DEFLATE มาตรฐาน วิธีการทำงานคือ ตรวจหาข้อมูลที่ซ้ำกันและลดขนาดของไฟล์โดยไม่ทำให้สูญเสียข้อมูล (lossless compression)

เมื่อผู้ใช้เข้าชมเว็บไซต์ Nginx จะบีบอัดไฟล์ HTML, CSS, JavaScript, JSON และไฟล์เอกสารอื่น ๆ ก่อนส่งไปยังเบราวเซอร์ เบราวเซอร์สมัยใหม่ทั้งหมดรองรับการแตกไฟล์ที่ถูกบีบอัดด้วย Gzip โดยอัตโนมัติ ผู้ใช้จึงไม่ต้องทำอะไรเพิ่มเติม

ประโยชน์ของ Gzip Compression

  • ลดขนาดไฟล์ได้ 50-90% ขึ้นอยู่กับประเภทไฟล์
  • เพิ่มความเร็วในการโหลดหน้าเว็บ
  • ประหยัดแบนด์วิดท์ของเซิร์ฟเวอร์
  • ปรับปรุงคะแนน SEO และ Core Web Vitals
  • ลดต้นทุนการใช้งานเซิร์ฟเวอร์

Gzip ทำงานอย่างไรใน Nginx

กระบวนการทำงานของ Gzip ใน Nginx มีขั้นตอนดังนี้:

  1. เบราวเซอร์ส่งคำขอ — เบราวเซอร์ส่ง HTTP header “Accept-Encoding: gzip” เพื่อบอก Nginx ว่ารองรับการบีบอัด
  2. Nginx ตรวจสอบการตั้งค่า — Nginx ตรวจสอบว่า Gzip ถูกเปิดใช้งานและชนิดไฟล์เป็นไปตามเงื่อนไขหรือไม่
  3. บีบอัดเนื้อหา — Nginx บีบอัดไฟล์ตามระดับการบีบอัดที่กำหนด
  4. ส่งผลลัพธ์ — ส่ง response ด้วย header “Content-Encoding: gzip” และเนื้อหาที่บีบอัด
  5. เบราวเซอร์แตกไฟล์ — เบราวเซอร์แตกไฟล์ที่บีบอัดและแสดงผลให้ผู้ใช้เห็น

วิธีการเปิดใช้งาน Gzip ใน nginx.conf

ในการตั้งค่า Gzip ใน Nginx คุณต้องแก้ไขไฟล์ nginx.conf ซึ่งมักจะอยู่ที่ /etc/nginx/nginx.conf ให้ทำตามขั้นตอนต่อไปนี้:

ขั้นตอนที่ 1: เปิดไฟล์ nginx.conf

sudo nano /etc/nginx/nginx.conf

ขั้นตอนที่ 2: เพิ่มการตั้งค่า Gzip

หาส่วน http block และเพิ่มการตั้งค่า Gzip ดังนี้:

http {
    # เปิดใช้งาน Gzip compression
    gzip on;
    gzip_min_length 1k;
    gzip_comp_level 6;
    gzip_types text/plain text/css text/xml text/javascript
               application/x-javascript application/xml+rss
               application/javascript application/json;
    gzip_vary on;
    gzip_buffers 32 4k;
    gzip_proxied any;
    gzip_disable "msie6";
}

ขั้นตอนที่ 3: ตรวจสอบและบันทึกการเปลี่ยนแปลง

sudo nginx -t
sudo systemctl reload nginx

Directive สำคัญของ Gzip

gzip on

เปิดใช้งาน Gzip compression ค่าเริ่มต้นคือ off (ปิด) คุณต้องตั้งเป็น on เพื่อเปิดใช้งาน

gzip on;

gzip_types

ระบุประเภท MIME types ที่ต้องการบีบอัด ค่าเริ่มต้นคือ text/html เท่านั้น ต้องเพิ่มประเภทอื่น ๆ ด้วย

gzip_types text/plain text/css text/xml text/javascript
           application/x-javascript application/xml+rss
           application/javascript application/json image/svg+xml;

gzip_min_length

กำหนดขนาดไฟล์ขั้นต่ำที่ต้องบีบอัด ไฟล์ที่มีขนาดเล็กกว่านี้จะไม่ถูกบีบอัด

gzip_min_length 1k;

gzip_comp_level

กำหนดระดับการบีบอัด ตั้งแต่ 1 (บีบอัดน้อย) ถึง 9 (บีบอัดมาก) ค่าแนะนำคือ 4-6

gzip_comp_level 6;

gzip_vary

เพิ่ม Vary header ให้กับ response เพื่อให้ proxy cache และ CDN รู้ว่าเนื้อหาถูกบีบอัด

gzip_vary on;

gzip_proxied

กำหนดว่าจะบีบอัดเนื้อหาที่ส่งมาจาก upstream servers ในกรณีใด

gzip_proxied any;

gzip_buffers

กำหนดจำนวนและขนาด buffer ที่ใช้เก็บข้อมูลบีบอัด

gzip_buffers 32 4k;

วิธีการทดสอบ Gzip Compression

หลังจากตั้งค่า Gzip แล้ว คุณต้องทดสอบว่าระบบทำงานได้อย่างถูกต้อง

curl -I -H "Accept-Encoding: gzip" https://example.com

ตรวจสอบว่า response header มี “Content-Encoding: gzip” และ “Vary: Accept-Encoding”

ผลการทดสอบประสิทธิภาพ

ประเภทไฟล์ขนาดเดิมขนาดหลังบีบอัดอัตราลด
HTML150 KB25 KB83%
CSS85 KB18 KB79%
JavaScript320 KB95 KB70%
JSON API200 KB30 KB85%
SVG120 KB35 KB71%

Best Practices สำหรับ Gzip Compression

1. ตั้งค่า gzip_comp_level ที่ 4-6 เพื่อสมดุลระหว่างการบีบอัดและ CPU

2. ไม่ควรบีบอัดไฟล์ที่บีบอัดแล้ว เช่น .jpg, .png, .gif, .mp4, .zip

3. พิจารณาใช้ Brotli compression เพิ่มเติม ซึ่งให้อัตราการบีบอัดดีกว่า 15-20%

สรุป

Gzip compression เป็นเทคนิคที่สำคัญสำหรับการปรับปรุงประสิทธิภาพของเว็บไซต์ ด้วยการเปิดใช้งาน Gzip ใน Nginx คุณสามารถลดขนาดไฟล์ได้ 70-85% เพิ่มความเร็วในการโหลดหน้าเว็บ ประหยัดแบนด์วิดท์ และปรับปรุง SEO การตั้งค่าเป็นเรื่องง่าย เพียงเพิ่มคำสั่งไม่กี่บรรทัดใน nginx.conf และ reload Nginx ก็พร้อมแล้ว

แนะนำบริการ DE

หากคุณกำลังมองหาเซิร์ฟเวอร์ที่มี Nginx และ Gzip compression ทำงานได้อย่างเหมาะสม DE (Dot Enterprise) มีบริการ Cloud VPS และ Cloud Hosting ที่ติดตั้ง Nginx พร้อมด้วยการตั้งค่าที่ปรับปรุงแล้ว เว็บไซต์ของคุณจะทำงานได้รวดเร็วและปลอดภัย