Léiert wéi Dir Websäiten mat Nginx a Gzip Modul beschleunegt


Och an enger Zäit wou bedeitend Internetgeschwindegkeete weltwäit verfügbar sinn, ass all Effort fir d'Websäit Laaschtzäiten ze optimiséieren mat oppenen Äerm wëllkomm.

An dësem Artikel wäerte mir eng Method diskutéieren fir d'Transfergeschwindegkeet ze erhéijen andeems d'Dateigréissten duerch d'Kompressioun reduzéiert ginn. Dës Approche bréngt en extra Virdeel datt et och d'Quantitéit vun der Bandbreedung reduzéiert déi am Prozess benotzt gëtt, a mécht et méi bëlleg fir de Websäitebesëtzer deen dofir bezilt.

Fir d'Zil z'erreechen, dat am uewe genannte Paragraphe steet, benotze mir Nginx a säin agebaute gzip Modul an dësem Artikel. Wéi déi offiziell Dokumentatioun seet, ass dëse Modul e Filter deen d'Äntwerte mat der bekannter gzip Kompressiounsmethod kompriméiert. Dëst garantéiert datt d'Gréisst vun den iwwerdroenen Donnéeën ëm d'Halschent oder souguer méi kompriméiert ginn.

No der Zäit wou Dir um Enn vun dësem Post kënnt, hutt Dir nach e weidere Grond fir Nginx ze benotzen fir Är Websäiten an Uwendungen ze déngen.

Nginx Web Server installéieren

Nginx ass verfügbar fir all grouss modern Verdeelungen. Obwuel mir eng CentOS 7 virtuell Maschinn (IP 192.168.0.29) fir dësen Artikel benotzen.

D'Instruktioune hei ënnen funktionnéieren och mat wéineg (wann iwwerhaapt) Ännerungen an anere Verdeelungen. Et gëtt ugeholl datt Äre VM eng frësch Installatioun ass; soss musst Dir sécher sinn datt et keng aner Webserver (wéi Apache) op Ärer Maschinn lafen.

Fir Nginx zesumme mat sengen erfuerderlechen Ofhängegkeeten z'installéieren, benotzt de folgende Kommando:

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

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

Fir z'iwwerpréiwen datt d'Installatioun erfollegräich ofgeschloss ass an datt Nginx Dateien servéiere kann, start de Webserver:

# systemctl start nginx
# systemctl enable nginx

an dann öffnen e Webbrowser a gitt op http://192.168.0.29 (vergiesst net den 192.168.0.29 duerch d'IP Adress oder Hostnumm vun Ärem Server ze ersetzen). Dir sollt d'Wëllkomm Säit gesinn:

Mir mussen am Kapp behalen datt verschidde Dateitypen besser kompriméiert kënne ginn wéi anerer. Einfach Textdateien (wéi HTML, CSS a JavaScript Dateien) kompriméieren ganz gutt, anerer (.iso Dateien, Tarballs a Biller, fir e puer ze nennen) net, well se scho vun der Natur kompriméiert sinn.

Also ass et ze erwaarden datt d'Kombinatioun vun Nginx a gzip eis erlaabt d'Transfergeschwindegkeet vun der fréierer ze erhéijen, während déi lescht wéineg oder guer keng Verbesserung weisen.

Et ass och wichteg am Kapp ze halen datt wann de gzip Modul aktivéiert ass, HTML Dateien ËMMER kompriméiert sinn, awer aner Dateitypen déi allgemeng op Websäiten an Uwendungen fonnt ginn (nämlech CSS a JavaScript) sinn net.

Testen Nginx Websäit Geschwindegkeet OUNI de gzip Modul

Fir unzefänken, loosst eis e komplette Bootstrap Template eroflueden, eng super Kombinatioun vun HTML, CSS, a JavaScript Dateien.

Nodeems Dir déi kompriméiert Datei erofgelueden hutt, wäerte mir et an de Root-Verzeichnis vun eisem Serverblock unzipéieren (erënnert datt dëst den Nginx-Äquivalent vun der DocumentRoot-Direktiv an enger Apache virtuelle Host-Deklaratioun ass):

# 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

Dir sollt déi folgend Verzeechnesstruktur bannent /var/www/html/tecmint hunn:

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

Gitt elo op http://192.168.0.29/tecmint a gitt sécher datt d'Säit richteg lued. Déi meescht modern Browser enthalen eng Rei vun Entwéckler Tools. Am Firefox kënnt Dir et iwwer de Menu Tools → Web Developer opmaachen.

Mir sinn besonnesch interesséiert am Netzwierk Ënnermenü, deen eis erlaabt all Netzwierkerfroen ze iwwerwaachen tëscht eisem Computer an dem lokalen Netzwierk an dem Internet.

Eng Ofkiirzung fir den Netzwierk Menü an den Entwéckler Tools opzemaachen ass Ctrl + Shift + Q. Dréckt dës Tastekombinatioun oder benotzt d'Menübar fir se opzemaachen.

Well mir interesséiert sinn den Transfert vun HTML, CSS, a JavaScript Dateien z'ënnersichen, klickt op d'Knäppercher ënnen an erfrëscht d'Säit. Am Haaptbildschierm gesitt Dir den Detail vum Transfert vun all HTML, CSS a JavaScript Dateien:

Riets vun der Gréisst Kolonn (déi déi eenzel Dateigréissten weist) gesitt Dir déi individuell Transfertzäiten. Dir kënnt och duebelklickt op all bestëmmte Fichier fir méi Detailer am Timing Tab ze gesinn.

Vergewëssert Iech datt Dir Notizen vun den Timings am uewe genannte Bild notéiert, fir datt Dir se mam selwechten Transfer vergläiche kënnt wann mir de gzip Modul aktivéiert hunn.

Aktivéiert a Konfiguratioun vum gzip Modul an Nginx

Fir de gzip Modul z'aktivéieren an ze konfiguréieren, öffnen /etc/nginx/nginx.conf, lokaliséiert den Haaptserverblock wéi am Bild hei drënner, a füügt oder ännert déi folgend Zeilen (vergiesst net de Semikolon um Enn oder Nginx wäert eng Fehlermeldung zréckginn beim Restart méi spéit!)

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

D'gzip-Direktiv schalt de gzip-Modul un oder aus, wärend gzip_types benotzt gëtt fir all MIME-Typen ze lëschten déi de Modul soll behandelen.

Fir méi iwwer MIME-Typen ze léieren an déi verfügbar Typen ze gesinn, gitt op Basics_of_HTTP_MIME_types.

Testen Nginx Websäit Geschwindegkeete Mat Gzip Kompressiounsmodul

Wann mir déi uewe genannte Schrëtt ofgeschloss hunn, loosst eis Nginx nei starten an d'Säit nei lueden andeems Dir Ctrl + F5 dréckt (erëm, dëst funktionnéiert am Firefox, also wann Dir en anere Browser benotzt, kuckt éischt déi entspriechend Dokumentatioun) fir de Cache ze iwwerschreiden a loosst eis d'Transferzäiten beobachten:

# systemctl restart nginx

D'Netzwierk Ufroen Tab weist e puer bedeitend Verbesserungen. Vergläicht d'Timing fir Iech selwer ze gesinn, bedenkt datt et d'Iwwerweisungen tëscht eisem Computer an 192.168.0.29 sinn (Iwwerweisungen tëscht Google Server an CDNs sinn iwwer eis Grëff):

Zum Beispill, loosst eis déi folgend Dateietransfer Beispiller virum/nodeems Dir gzip aktivéiert hutt. Timings ginn a Millisekonnen uginn:

  1. index.html (vertrueden duerch /tecmint/ uewen op der Lëscht): 15/4
  2. Creative.min.css: 18/8
  3. jquery.min.js: 17/7

Maacht dëst Iech net Nginx nach méi gär? Wat ech betrëfft, mécht et!

Resumé

An dësem Artikel hu mir bewisen datt Dir den Nginx gzip Modul benotze kënnt fir Dateientransfer ze beschleunegen. Déi offiziell Dokumentatioun fir gzip Modul listet aner Konfiguratiounsdirektiven op déi Dir wëllt kucken.

Zousätzlech huet d'Mozilla Developer Network Websäit en Entrée iwwer den Network Monitor, deen erkläert wéi Dir dëst Tool benotzt fir ze verstoen wat hannert de Kulissen an enger Netzwierkfuerderung lass ass.

Wéi ëmmer, fillt Iech gratis de Kommentarformular hei ënnen ze benotzen wann Dir Froen iwwer dësen Artikel hutt. Mir freeën eis ëmmer vun Iech ze héieren!