Cara Menambahkan Modul gzip ke Nginx di Ubuntu 16.04

2
22
views

Seberapa cepat sebuah situs web akan dimuat tergantung pada ukuran semua file yang harus didownload oleh browser. Mengurangi ukuran file yang akan ditransmisikan bisa membuat situs web tidak hanya memuat lebih cepat, tapi juga lebih murah bagi mereka yang harus membayar penggunaan bandwidth mereka.

gzip Adalah program kompresi data yang populer. Anda dapat mengkonfigurasi Nginx untuk digunakan gzip untuk memampatkan file yang dilayaninya dengan cepat. File-file tersebut kemudian didekompresi oleh browser yang mendukungnya saat pengambilan tanpa kehilangan apapun, namun dengan sedikit data yang ditransfer antara server web dan browser.

Karena cara kerja kompresi pada umumnya, tapi juga cara gzip kerjanya, file tertentu kompres lebih baik dari yang lain. Sebagai contoh, file teks terkompres dengan baik, sering berakhir lebih dari dua kali lebih kecil hasilnya. Di sisi lain, gambar seperti file JPEG atau PNG sudah dikompres oleh sifatnya dan kompresi kedua menggunakan gzip hasil sedikit atau tanpa hasil. Mengompresi file menggunakan sumber daya server, jadi yang terbaik hanyalah kompres file-file yang akan mengurangi ukurannya dalam hasil.

Dalam panduan ini, kita akan membahas cara mengkonfigurasi Nginx yang terinstal di server Ubuntu 16.04 Anda untuk memanfaatkan gzip kompresi untuk mengurangi ukuran konten yang dikirim ke pengunjung situs.

Gzip Nginx
Gzip Nginx

Langkah 1 – Membuat Test Files

Pada langkah ini, kita akan membuat beberapa file uji di direktori Nginx default ke gzip kompresi teks .

Untuk membuat keputusan seperti apa file yang ditayangkan melalui jaringan, Nginx tidak menganalisa isi file karena tidak akan cukup cepat. Sebagai gantinya, ia hanya mencari ekstensi file untuk menentukan tipe MIME -nya , yang menunjukkan tujuan file.

Karena perilaku ini, isi file uji tidak relevan. Dengan menamai file dengan tepat, kita bisa mengelabui Nginx agar berpikir bahwa satu file yang sama sekali kosong adalah gambar dan gambar yang lain, misalnya, adalah stylesheet.

Dalam konfigurasi kami, Nginx tidak akan memampatkan file yang sangat kecil, jadi kami akan membuat file uji berukuran persis 1 kilobyte. Ini akan memungkinkan kita untuk memverifikasi apakah Nginx menggunakan kompresi di mana seharusnya, mengompres satu jenis file dan tidak melakukannya dengan yang lain.

Buat file 1 kilobyte yang dinamai test.html dalam direktori Nginx default truncate. Ekstensi menunjukkan bahwa itu adalah halaman HTML.

sudo truncate -s 1k /var/www/html/test.html

Mari buat beberapa file uji lagi dengan cara yang sama: satu jpg file gambar, satu css stylesheet, dan satu js file JavaScript.

sudo truncate -s 1k /var/www/html/test.jpg
sudo truncate -s 1k /var/www/html/test.css
sudo truncate -s 1k /var/www/html/test.js

Langkah selanjutnya adalah memeriksa bagaimana Nginx berperilaku berkenaan dengan kompresi pada instalasi baru dengan file yang baru saja kita buat.

Langkah 2 – Memeriksa Perilaku Default

Mari kita periksa apakah file HTML bernama test.html disajikan dengan kompresi. Perintah tersebut meminta file dari server Nginx kami, dan menentukan bahwa tidak apa-apa untuk menyajikan gzip konten yang dikompres dengan menggunakan header HTTP ( Accept-Encoding: gzip).

curl -H "Accept-Encoding: gzip" -I http://localhost/test.html

Sebagai tanggapan, Anda harus melihat beberapa header respons HTTP:

HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jun 2017 20:04:12 GMT
Content-Type: text/html
Last-Modified: Tue, 04 Mar 2017 11:46:45 GMT
Connection: keep-alive
Content-Encoding: gzip

Di baris terakhir, Anda bisa melihat Content-Encoding: gzip headernya. Ini memberitahu kita bahwa gzip kompresi telah digunakan untuk mengirim file ini. Hal ini terjadi karena pada Ubuntu 16.04, Nginx telah gzip mengaktifkan kompresi secara otomatis setelah instalasi dengan pengaturan default.

Namun, secara default, Nginx hanya memampatkan file HTML. Setiap file lain pada instalasi baru akan disajikan tanpa kompresi. Untuk memverifikasi itu, Anda dapat meminta gambar uji kami yang dinamai test.jpg dengan cara yang sama.

curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg

Hasilnya harus sedikit berbeda dari sebelumnya:

HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jun 2017 20:10:34 GMT
Content-Type: image/jpeg
Content-Length: 0
Last-Modified: Tue, 19 Jun 2017 20:06:22 GMT
Connection: keep-alive
ETag: "569e973e-0"
Accept-Ranges: bytes

Tidak ada Content-Encoding: gzip header dalam output, yang berarti file tersebut disajikan tanpa kompresi.

Anda bisa mengulang tes dengan menguji stylesheet CSS.

curl -H "Accept-Encoding: gzip" -I http://localhost/test.css

Sekali lagi, tidak ada yang menyebutkan kompresi pada outputnya.

HTTP/1.1 200 OK
Server: nginx/1.4.6 (Ubuntu)
Date: Tue, 19 Jun 2017 20:20:33 GMT
Content-Type: text/css
Content-Length: 0
Last-Modified: Tue, 19 Jun 2017 20:20:33 GMT
Connection: keep-alive
ETag: "569e9a91-0"
Accept-Ranges: bytes

Langkah selanjutnya adalah mengkonfigurasi Nginx agar tidak hanya melayani file HTML terkompresi, tapi juga format file lain yang bisa mendapat keuntungan dari kompresi.

Langkah 3 – Mengkonfigurasi Pengaturan gzip Nginx

Untuk mengubah gzip konfigurasi Nginx , buka file konfigurasi Nginx utama di nano atau editor teks favorit Anda.

sudo nano /etc/nginx/nginx.conf

Temukan bagian gzip pengaturan, yang terlihat seperti ini:

. . .
##
# `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/x-javascript text/xml application/xml application/xml+rss text/javascript;
. . .

Anda dapat melihatnya secara default, gzip kompresi diaktifkan oleh gzip enable perintah tersebut, namun beberapa pengaturan tambahan dikomentari dengan # tanda komentar. Kami akan membuat beberapa perubahan pada bagian ini:

  • Aktifkan pengaturan tambahan dengan memberi tanda komentar pada semua baris yang berkomentar (misalnya, dengan menghapusnya # di awal baris)
  • Tambahkan gzip_min_length 256;direktif, yang memberitahu Nginx untuk tidak memampatkan file yang lebih kecil dari 256 byte. Ini file yang sangat kecil nyaris tidak mendapat manfaat dari kompresi.
  • Tambahkan gzip_typesdirektif dengan jenis file tambahan yang menunjukkan font web, icoikon, dan gambar SVG.

Setelah perubahan ini diterapkan, bagian pengaturan akan terlihat seperti ini:

. . .
##
# `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_min_length 256;
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/vnd.ms-fontobject application/x-font-ttf font/opentype image/svg+xml image/x-icon;
. . .

Simpan dan tutup file yang akan keluar.

Untuk mengaktifkan konfigurasi baru, muat ulang Nginx.

sudo systemctl reload nginx

Langkah selanjutnya adalah mengecek apakah perubahan konfigurasi sudah sesuai dengan yang diharapkan.

Langkah 4 – Memeriksa Konfigurasi Baru

Kita bisa menguji ini seperti yang kita lakukan di langkah 2, dengan menggunakan curl masing-masing file uji dan memeriksa output untuk Content-Encoding: gzip header.

curl -H "Accept-Encoding: gzip" -I http://localhost/test.html
curl -H "Accept-Encoding: gzip" -I http://localhost/test.jpg
curl -H "Accept-Encoding: gzip" -I http://localhost/test.css
curl -H "Accept-Encoding: gzip" -I http://localhost/test.js

Sekarang hanya test.jpg, yang merupakan file gambar, harus tetap terkompresi. Dalam semua contoh lainnya, Anda harus bisa menemukan Content-Encoding: gzip header pada outputnya.

Jika demikian, Anda telah mengkonfigurasi gzip kompresi di Nginx dengan sukses!

Mengubah konfigurasi Nginx untuk sepenuhnya menggunakan gzip kompresi itu mudah, namun manfaatnya bisa sangat besar. Tidak hanya pengunjung dengan bandwidth terbatas yang akan menerima situs lebih cepat tapi juga Google akan senang dengan loading situs lebih cepat. Kecepatan traksi sebagai bagian penting dari web modern dan penggunaan gzip merupakan salah satu langkah besar untuk memperbaikinya.

2 COMMENTS

LEAVE A REPLY

Please enter your comment!
Please enter your name here