Mengaktifkan kompresi GZIP di Nginx

Ceritanya dari Google Webmasters saya mendapatkan email bahwa beberapa situs saya lambat untuk dibuka dan diberi link hasil analisa pada PageSpeed Insights. Semuanya saya host di Nginx web server. Dari pengujiannya ditemukan ternyata kompresi GZIP tidak aktif untuk koneksi HTTP/HTTPS, padahal ini bisa menghemat bandwidth juga mempercepat loading website. Kok bisa lupa ya. Haha. 😛

Solusinya sih sangat mudah, tinggal mengaktifkan GZIP di Nginx dan mengatur sedikit settingnya supaya optimal mengkompresi jenis file apa saja. Jadi silahkan akses nginx.conf dan diedit:

nano /etc/nginx/nginx.conf

Kemudian cari bagian bernama Gzip Settings didalamnya, tepat saat saya mengeceknya padahal sudah dalam keadaan hidup (On) tapi settingnya masih dalam bentuk komentar, jadi tinggal hilangkan simbol pagar (#) didepannya dan menggunakan konfigurasi default aslinya sudahlah cukup. Tapi saya menganjurkan agar menggunakan setting Gzip Nginx dari HTML5BoilerPlate karena lebih lengkap dan sudah teruji:

  # Compression

  # Enable Gzip compressed.
  gzip on;

  # Compression level (1-9).
  # 5 is a perfect compromise between size and cpu usage, offering about
  # 75% reduction for most ascii files (almost identical to level 9).
  gzip_comp_level    5;

  # Don't compress anything that's already small and unlikely to shrink much
  # if at all (the default is 20 bytes, which is bad as that usually leads to
  # larger files after gzipping).
  gzip_min_length    256;

  # Compress data even for clients that are connecting to us via proxies,
  # identified by the "Via" header (required for CloudFront).
  gzip_proxied       any;

  # Tell proxies to cache both the gzipped and regular version of a resource
  # whenever the client's Accept-Encoding capabilities header varies;
  # Avoids the issue where a non-gzip capable client (which is extremely rare
  # today) would display gibberish if their proxy gave them the gzipped version.
  gzip_vary          on;

  # Compress all output labeled with one of the following MIME-types.
  gzip_types
    application/atom+xml
    application/javascript
    application/json
    application/ld+json
    application/manifest+json
    application/rss+xml
    application/vnd.geo+json
    application/vnd.ms-fontobject
    application/x-font-ttf
    application/x-web-app-manifest+json
    application/xhtml+xml
    application/xml
    font/opentype
    image/bmp
    image/svg+xml
    image/x-icon
    text/cache-manifest
    text/css
    text/plain
    text/vcard
    text/vnd.rim.location.xloc
    text/vtt
    text/x-component
    text/x-cross-domain-policy;
  # text/html is always compressed by HttpGzipModule

Tinggal copypaste saja kode – kode diatas pada lokasi blok Gzip tersebut. Nanti file – file yang akan diGzip seperti JavaScript, CSS, HTML, Teks, XML dan sebagainya yang memiliki rasio kompresi tinggi. Jadi manfaatnya akan langsung terasa. Kemudian restart servernya:

service nginx restart

Akhirnya silahkan uji apakah memang sudah aktif kompresi HTTPnya dengan mengecek headernya apakah ada teks Content-Encoding: gzip atau Content-Encoding: deflate, kalau ya berarti selesai sudah prosesnya. 🙂