Pelajari cara mempercepat situs web menggunakan modul Nginx dan GZIP

Bahkan di masa ketika kecepatan internet yang signifikan tersedia di seluruh dunia, setiap upaya untuk mengoptimalkan waktu pemuatan situs web diterima dengan senjata terbuka.

Pada artikel ini kita akan membahas metode untuk meningkatkan kecepatan transfer dengan mengurangi ukuran file melalui kompresi. Pendekatan ini membawa manfaat tambahan karena juga mengurangi jumlah bandwidth yang digunakan dalam prosesnya, dan membuatnya lebih murah untuk pemilik situs web yang membayarnya.

Untuk mencapai tujuan yang dinyatakan dalam paragraf di atas, kami akan menggunakan Nginx dan bawaannya Gzip modul dalam artikel ini. Seperti yang dinyatakan oleh dokumentasi resmi, modul ini adalah filter yang menekan respons menggunakan metode kompresi GZIP yang terkenal. Ini memastikan bahwa ukuran data yang ditransmisikan akan dikompres setengah atau bahkan lebih.

Disarankan Baca: Panduan Utama untuk Mengamankan, Mengeras dan Meningkatkan Kinerja Situs Web Nginx

Pada saat Anda mencapai bagian bawah posting ini, Anda akan memiliki alasan lain untuk mempertimbangkan menggunakan Nginx untuk melayani situs web dan aplikasi Anda.

Menginstal server web nginx

Nginx tersedia untuk semua distribusi modern utama. Meskipun kami akan menggunakan a Centos 7 mesin virtual (IP 192.168.0.29) untuk artikel ini.

Instruksi yang diberikan di bawah ini akan bekerja dengan sedikit (jika ada) modifikasi di distribusi lain juga. Diasumsikan bahwa Anda Vm adalah instalasi baru; Jika tidak, Anda harus memastikan bahwa tidak ada server web lainnya (seperti Apache) berjalan di mesin Anda.

Untuk memasang Nginx Seiring dengan dependensi yang diperlukan, gunakan perintah berikut:

----------- Di Centos/Rhel 7 dan Fedora 22-24 ----------- # yum update && yum install nginx ----------- Tentang distribusi Debian dan Ubuntu ----------- # Perbarui Apt && App Instal Nginx 

Untuk memverifikasi bahwa instalasi telah berhasil diselesaikan dan itu Nginx dapat melayani file, memulai server web:

# Systemctl Mulai Nginx # Systemctl Aktifkan Nginx 

dan kemudian buka browser web dan pergi ke http: // 192.168.0.29 (Jangan lupa untuk mengganti 192.168.0.29 dengan alamat IP atau nama host dari server Anda). Anda harus melihat halaman selamat datang:

Halaman Selamat Datang Default Nginx

Kita harus ingat bahwa beberapa jenis file dapat dikompresi lebih baik dari yang lain. File teks biasa (seperti Html, CSS, Dan Javascript file) kompres dengan sangat baik saat yang lain (.iso file, Tarballs, Dan gambar-gambar, untuk beberapa nama) tidak, karena mereka sudah dikompresi secara alami.

Dengan demikian, diharapkan bahwa kombinasi Nginx Dan Gzip akan memungkinkan kita untuk meningkatkan kecepatan transfer yang pertama, sedangkan yang terakhir mungkin menunjukkan sedikit atau tidak ada peningkatan sama sekali.

Penting juga untuk diingat bahwa saat Gzip modul diaktifkan, Html file adalah SELALU terkompresi, tetapi jenis file lain yang biasa ditemukan di situs web dan aplikasi (yaitu, CSS Dan Javascript) tidak.

Menguji kecepatan situs web nginx tanpa modul GZIP

Untuk memulai, mari kita unduh lengkap Bootstrap template, kombinasi yang bagus Html, CSS, Dan Javascript file.

Setelah mengunduh file terkompresi, kami akan membuka ritsleting ke direktori root blok server kami (ingat bahwa ini adalah Nginx setara dengan Root document Petunjuk dalam deklarasi host virtual Apache):

# CD/var/www/html # wget https: // github.com/blackrockdigital/startbootstrap-creative/arsip/gh-pages.zip # unzip -a halaman gh.zip # mv startbootstrap-creative-gh-halaman tecmint 

Anda harus memiliki struktur direktori berikut /var/www/html/tecmint:

# ls -l/var/www/html/tecmint 

Konten nginx documentroot

Sekarang pergi ke http: // 192.168.0.29/tecmint dan pastikan halaman dimuat dengan benar. Sebagian besar browser modern termasuk satu set alat pengembang. Di dalam Firefox, Anda dapat membukanya melalui Alat → Pengembang Web menu.

Kami sangat tertarik dengan Jaringan submenu, yang akan memungkinkan kami untuk memantau semua permintaan jaringan yang terjadi antara komputer kami dan jaringan lokal dan internet.

Disarankan Baca: Instal mod_pagespeed untuk mempercepat kinerja nginx hingga 10x

Jalan pintas untuk membuka Jaringan Menu di alat pengembang adalah Ctrl + Shift + Q. Tekan kombinasi tombol itu atau gunakan bilah menu untuk membukanya.

Karena kami tertarik untuk memeriksa transfer Html, CSS, Dan Javascript file, klik tombol di bagian bawah dan menyegarkan halaman. Di layar utama Anda akan melihat detail transfer semua Html, CSS, Dan Javascript File:

Periksa Nginx menggunakan kompresi

Di sebelah kanan Ukuran kolom (yang menunjukkan ukuran file individual) Anda akan melihat waktu transfer individual. Anda juga dapat mengklik dua kali file apa pun untuk melihat detail lebih lanjut di Pengaturan waktu tab.

Pastikan Anda mencatat waktu yang ditunjukkan pada gambar di atas sehingga Anda dapat membandingkannya dengan transfer yang sama setelah kami mengaktifkan Gzip modul.

Mengaktifkan dan Mengkonfigurasi Modul GZIP di Nginx

Untuk mengaktifkan dan mengonfigurasi Gzip modul, buka /etc/nginx/nginx.conf, Temukan blok server utama seperti yang ditunjukkan pada gambar di bawah ini, dan tambahkan atau ubah baris berikut (jangan lupa titik koma di akhir atau nginx akan mengembalikan pesan kesalahan saat memulai kembali nanti!)

root/var/www/html; gzip on; GZIP_Types Teks/gambar biasa/gambar JPEG/Teks PNG/Teks CSS/JavaScript; 

Aktifkan modul GZIP di nginx

Itu Gzip PERTANYAAN PERTANYAAN pada atau mati modul gzip, sedangkan gzip_types digunakan untuk mendaftar semua jenis mime yang harus ditangani modul.

Untuk mempelajari lebih lanjut tentang PANTOMIM Jenis dan Lihat Jenis yang Tersedia, Buka Basics_OF_HTTP_MIME_TYPES.

Menguji kecepatan situs web nginx dengan modul kompresi gzip

Setelah kami menyelesaikan langkah -langkah di atas, mari kita restart Nginx dan muat ulang halaman dengan menekan Ctrl + F5 (Sekali lagi, ini berhasil Firefox, Jadi, jika Anda menggunakan browser yang berbeda, konsultasikan terlebih dahulu, dokumentasi yang sesuai) untuk mengganti cache dan mari kita amati waktu transfer:

# Systemctl restart nginx 

Tab Permintaan Jaringan menunjukkan beberapa peningkatan yang signifikan. Bandingkan waktu untuk melihat sendiri, ingatlah bahwa itu adalah transfer antara komputer kami dan 192.168.0.29 (Transfer antara server Google dan CDN berada di luar genggaman kami):

Menguji dan memverifikasi kompresi Nginx GZIP

Misalnya, mari kita pertimbangkan contoh transfer file berikut sebelum / setelah mengaktifkan GZIP. Pengaturan waktu diberikan dalam milidetik:

1. indeks.html (dipersembahkan oleh /tecmint/ di bagian atas daftar): 15/4
2. Kreatif.Min.CSS: 18/8
3. jQuery.Min.JS: 17/7

Bukankah ini membuatmu mencintai Nginx bahkan lebih? Sejauh yang saya ketahui, itu terjadi!

Disarankan Baca: 5 tips untuk meningkatkan kinerja server web Apache Anda

Ringkasan

Pada artikel ini kami telah menunjukkan bahwa Anda dapat menggunakan modul Nginx GZIP untuk mempercepat transfer file. Dokumentasi resmi untuk modul GZIP mencantumkan arahan konfigurasi lain yang mungkin ingin Anda lihat.

Selain itu, situs web Mozilla Developer Network memiliki entri tentang monitor jaringan yang menjelaskan cara menggunakan alat ini untuk memahami apa yang terjadi di balik layar dalam permintaan jaringan.

Seperti biasa, jangan ragu untuk menggunakan formulir komentar di bawah ini jika Anda memiliki pertanyaan tentang artikel ini. Kami selalu menantikan kabar dari Anda!