Pagkat-on Unsaon Pagpapaspas ang mga Website Gamit ang Nginx ug Gzip Module


Bisan sa usa ka panahon nga ang hinungdanon nga katulin sa Internet magamit sa tibuuk kalibutan, ang tanan nga paningkamot aron ma-optimize ang mga oras sa pagkarga sa website giabiabi uban ang bukas nga mga bukton.

Niini nga artikulo atong hisgutan ang usa ka pamaagi aron madugangan ang mga katulin sa pagbalhin pinaagi sa pagkunhod sa mga gidak-on sa file pinaagi sa compression. Kini nga pamaagi nagdala og dugang nga kaayohan tungod kay kini usab nagpamenos sa gidaghanon sa bandwidth nga gigamit sa proseso, ug naghimo niini nga mas barato alang sa tag-iya sa website nga nagbayad niini.

Aron matuman ang tumong nga gipahayag sa parapo sa ibabaw, atong gamiton ang Nginx ug ang built-in nga gzip module niini nga artikulo. Sama sa giingon sa opisyal nga dokumentasyon, kini nga module usa ka filter nga nag-compress sa mga tubag gamit ang ilado nga gzip compression nga pamaagi. Gisiguro niini nga ang gidak-on sa gipasa nga datos ma-compress sa katunga o labaw pa.

Sa panahon nga makaabot ka sa ubos niini nga post, aduna ka pay laing rason nga ikonsiderar ang paggamit sa Nginx sa pag-alagad sa imong mga website ug aplikasyon.

Pag-instalar sa Nginx Web Server

Magamit ang Nginx alang sa tanan nga dagkong moderno nga pag-apod-apod. Bisan kung mogamit kami usa ka CentOS 7 virtual machine (IP 192.168.0.29) alang sa kini nga artikulo.

Ang mga panudlo nga gihatag sa ubos magamit sa gamay (kung naa) mga pagbag-o sa ubang mga distribusyon usab. Gituohan nga ang imong VM usa ka bag-ong pag-instalar; kung dili, kinahanglan nimong sigurohon nga wala’y uban pang mga web server (sama sa Apache) nga nagdagan sa imong makina.

Aron i-install ang Nginx uban ang gikinahanglan nga mga dependency, gamita ang mosunod nga sugo:

----------- On CentOS/RHEL 7 and Fedora 22-24 ----------- 
# yum update && yum install nginx

----------- On Debian and Ubuntu Distributions ----------- 
# apt update && apt install nginx

Aron mapamatud-an nga ang pag-instalar malampuson nga nahuman ug nga ang Nginx makaalagad sa mga file, sugdi ang web server:

# systemctl start nginx
# systemctl enable nginx

ug dayon ablihi ang web browser ug adto sa http://192.168.0.29 (ayaw kalimti ang pag-ilis sa 192.168.0.29 sa IP address o hostname sa imong server). Kinahanglan nimo nga makita ang Welcome page:

Kinahanglan natong hinumdoman nga ang pipila ka mga tipo sa file mahimong ma-compress nga mas maayo kay sa uban. Ang yano nga mga text file (sama sa HTML, CSS, ug JavaScript nga mga file) maayo kaayo nga pag-compress samtang ang uban (.iso files, tarballs, ug mga imahe, sa paghingalan sa pipila) wala, tungod kay sila na-compress na sa kinaiyahan.

Sa ingon, gilauman nga ang kombinasyon sa Nginx ug gzip magtugot kanamo nga madugangan ang katulin sa pagbalhin sa una, samtang ang ulahi mahimo’g magpakita gamay o wala’y pag-uswag.

Importante usab nga hinumdoman nga kung ang gzip module ma-enable, ang mga HTML file KANUNAY nga gi-compress, apan ang ubang mga tipo sa file nga sagad makita sa mga website ug aplikasyon (nga mao, CSS ug JavaScript) dili.

Pagsulay sa Nginx Website Speeds WALA ang gzip Module

Sa pagsugod, mag-download kita og kompleto nga Bootstrap template, usa ka maayong kombinasyon sa HTML, CSS, ug JavaScript nga mga file.

Human ma-download ang compressed file, among i-unzip kini sa root directory sa among server block (hinumdomi nga kini ang Nginx equivalent sa DocumentRoot directive sa Apache virtual host declaration):

# cd /var/www/html
# wget https://github.com/BlackrockDigital/startbootstrap-creative/archive/gh-pages.zip
# unzip -a gh-pages.zip
# mv startbootstrap-creative-gh-pages tecmint

Kinahanglan nga aduna kay mosunod nga istruktura sa direktoryo sulod sa /var/www/html/tecmint:

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

Karon adto sa http://192.168.0.29/tecmint ug siguroha nga husto ang pagkarga sa panid. Kadaghanan sa modernong browser naglakip sa usa ka hugpong sa mga himan sa developer. Sa Firefox, mahimo nimo kini ablihan pinaagi sa Tools → Web Developer menu.

Interesado kami ilabi na sa Network submenu, nga magtugot kanamo sa pagmonitor sa tanang mga hangyo sa network nga mahitabo tali sa among kompyuter ug sa lokal nga network ug sa Internet.

Ang shortcut sa pag-abli sa Network menu sa developer tools mao ang Ctrl + Shift + Q. Pindota ang yawe nga kombinasyon o gamita ang menu bar aron maablihan kini.

Tungod kay kami interesado sa pagsusi sa pagbalhin sa HTML, CSS, ug JavaScript nga mga file, i-klik ang mga buton sa ubos ug i-refresh ang panid. Sa main screen imong makita ang detalye sa pagbalhin sa tanang HTML, CSS, ug JavaScript files:

Sa tuo sa Laki nga kolum (nga nagpakita sa indibidwal nga mga gidak-on sa file) imong makita ang indibidwal nga mga timing sa pagbalhin. Mahimo ka usab nga magdoble click sa bisan unsang gihatag nga file aron makita ang dugang nga mga detalye sa tab nga Timings.

Siguroha nga imong gikuha ang mga nota sa mga timing nga gipakita sa ibabaw nga hulagway aron imong ikumpara sila sa samang pagbalhin sa higayon nga mahimo na namo ang gzip module.

Pag-enable ug Pag-configure sa gzip Module sa Nginx

Aron ma-enable ug ma-configure ang gzip module, ablihi ang /etc/nginx/nginx.conf, pangitaa ang main server block sama sa gipakita sa ubos nga hulagway, ug idugang o usba ang mosunod nga mga linya (ayaw kalimti ang semicolon sa katapusan o ang Nginx magbalik sa usa ka mensahe sa sayup samtang magsugod pag-usab sa ulahi!)

root     	/var/www/html;
gzip on;
gzip_types text/plain image/jpeg image/png text/css text/javascript;

Ang gzip nga direktiba nag-turn on o off sa gzip module, samtang ang gzip_types gigamit sa paglista sa tanang MIME type nga kinahanglan dumalahon sa module.

Aron makakat-on og dugang mahitungod sa mga tipo sa MIME ug tan-awon ang anaa nga mga tipo, adto sa Basics_of_HTTP_MIME_types.

Pagsulay sa Nginx Website Speeds Uban sa Gzip Compression Module

Kung nahuman na namo ang mga lakang sa ibabaw, atong i-restart ang Nginx ug i-reload ang panid pinaagi sa pagpindot Ctrl + F5 (pag-usab, kini molihok sa Firefox, busa kung mogamit ka og lain nga browser konsultaha una ang katugbang nga dokumentasyon) aron i-override ang cache ug atong obserbahan ang mga oras sa pagbalhin:

# systemctl restart nginx

Ang tab nga hangyo sa network nagpakita sa pipila ka hinungdanon nga mga pag-uswag. Itandi ang mga timing aron makita sa imong kaugalingon, hinumdomi nga kini ang mga pagbalhin tali sa among kompyuter ug 192.168.0.29 (ang mga pagbalhin tali sa mga server sa Google ug mga CDN dili na nato masabtan):

Pananglitan, atong tagdon ang mosunod nga mga pananglitan sa pagbalhin sa file sa wala pa/human sa pagpagana sa gzip. Ang mga timing gihatag sa milliseconds:

  1. index.html (girepresentar sa /tecmint/ sa ibabaw sa listahan): 15/4
  2. Creative.min.css: 18/8
  3. jquery.min.js: 17/7

Dili ba kini nakapahimo kanimo nga mas gihigugma ang Nginx? Sa akong hunahuna, kini mahitabo!

Summary

Niini nga artikulo among gipakita nga mahimo nimong gamiton ang Nginx gzip module aron mapadali ang mga pagbalhin sa file. Ang opisyal nga dokumentasyon alang sa gzip module naglista sa ubang mga direktiba sa pag-configure nga mahimo nimong tan-awon.

Dugang pa, ang website sa Mozilla Developer Network adunay usa ka entry bahin sa Network Monitor nga nagpatin-aw kung giunsa paggamit kini nga himan aron masabtan kung unsa ang nahitabo sa luyo sa mga eksena sa usa ka hangyo sa network.

Sama sa kanunay, ayaw gamita ang porma sa komento sa ubos kung adunay ka mga pangutana bahin sa kini nga artikulo. Kanunay kaming nagpaabot nga makadungog gikan kanimo!