Blog

Tingkatkan Performa Dengan Mengaktifkan Gzip di server Nginx

 

Tingkatkan Performa Dengan Mengaktifkan Gzip di server Nginx

Server     2 bulan yang lalu


Beberapa klien saya sempat mengeluh dengan waktu respon website yang cenderung lambat. Setelah saya cek ternyata ukuran file statis mereka cukup besar (seperti gambar, dll)

Diartikel ini akan saya ulas salah satu trik buat meningkatkan kecepatan website dengan mengaktifkan Gzip pada server.

Kita ikuti best practice dari HTML5Boilerplate ya, Disitus tersebut juga banyak tips dan trik yang menurut saya pribadi sangat ok.

Baik, kita langsung saja. Silahkan akses server via SSH lalu buka file nginx.conf.

nano /etc/nginx/nginx.conf

Temukan blok pengaturan Gzip di file tersebut!

##
# Gzip Settings
##

Gzip on;
Gzip_disable "msie6";

# Gzip_vary on;
# Gzip_proxied any;
# Gzip_comp_level 6;
# Gzip_buffers 16 8k;
# Gzip_http_version 1.1;
# Gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

Selanjutnaya tambahkan script dibawah ini.

# Compression

# Enable Gzip compressed.
gzip on;

# Enable compression both for HTTP/1.0 and HTTP/1.1.
gzip_http_version  1.1;

# 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/rss+xml
  application/vnd.ms-fontobject
  application/x-font-ttf
  application/x-web-app-manifest+json
  application/xhtml+xml
  application/xml
  font/opentype
  image/svg+xml
  image/x-icon
  text/css
  text/plain
  text/x-component;
# text/html is always compressed by HttpGzipModule

Langkah terakhir restart Nginx.

service nginx restart

Kita bisa cek apakah server kita telah berhasil mengaktifkan Gzip. Cara simpelnya bisa melalui link https://redbot.org.

Yup, begitulah caranya. Simpel kan? Semoga bermanfaat.


Kami membuat aplikasi pelayanan kependudukan dan administrasi untuk Desa dan Kelurahan. Demo bisa diakses di https://dash.klandesa.com. Silahkan gunakan email: demo@klandesa.com dan password: 123456


CARI ARTIKEL
Card image cap
AUTHOR: Wisnu

"Client-facing" person. His goal - help clients/projects succeed and always coding.


Lihat Project Kami | Bertemu Tim Kami

Tertarik berkerja dengan kami? Email disini:
wisnu@tipa.co.id