Saytingizni GZIP compression orqali optimallashtirish

Saytingizni GZIP compression orqali optimallashtirish

Yusupov Hayitbek

Compression ( fayllarni optimallashtirib, kichiklashtirish ) saytingizni tezligini oshirishning eng sodda va eng yaxshi yo'li hisoblanadi. Men avvallari eski brauzerlarda duch kelinadigan muammolar tufayli Javascript fayllarni gzip compression orqali optimallashtirishni maslahat berishga ikkilanar edim.


Lekin hozir 21-asr. Ma'lumotlarning ko'p qismi zamonaviy brauzerlardan keladi va mening ko'p kuzatuvchilarimning ko'pchiligi zamonaviy texnologiyalar ham bilan hamnafas. Men endi kimdur Windows 95da Internet Explorer 4 ishlatishi haqida o'ylab o'tirishimga hojat yo'q. Hozirgi eng so'nggi zamonaviy brauzerlar eng yaxshi kontent va tezlikdan bahra olishi kerak va bu tezlikka erishishga yordam beradigan narsa bu - gzip encoding hisoblanadi

To'xtang, to'xtang, to'xtang: Bu bizga nega kerak?

Men avval sizlarga encoding nima ekanligini tushuntirishim kerak. Siz qandaydir http://www.yahoo.com/index.html ga o'xshash faylga so'rov yuborganingizda sizning brauzeringiz veb serverga murojaat qiladi va bu murojaat quyidagicha bo'ladi:


Brauzer: Salom, menga /index.html ni OLIB KEL

Server: Ok, men index.html faylini qidirib ko'raychi

Server: Topdim! Sizga javob sifatida 200 status kodini jo'nataman (200 OK). Faylni jo'natyapman

Brauzer: 100kb? kutyapman, kutyapman... vanihoyat fayl yuklandi.


Albatta haqiqiy holatda bu narsa ancha boshqacha bo'ladi. Agar buni chuqurroq o'rganmoqchi bo'lsangiz mana shu ssilkaga o'ting.


Hammasi joyidadek go'yo. Siz so'rov yuborgan faylingiz yuklandi.


Lekin asl muammo nimada?

Barchasi to'g'ri ishlayaptiku, lekin bu eng optimal yo'l emas. 100kb bu haddan tashqari ko'p, ochig'ini aytganda, HTML fayl saviyasiz. Hamma <html>, <table> va <div> teglarining yopilish teglari deyarli bir xil. Faylda bir xil so'zlar takror-takror kelgan. Har qanaqasiga ham, HTML fayl optimal emas


Xo'sh, fayl juda katta hajmga ega bo'lib ketganda nima qilsa bo'ladi? Uni optimallashtirish va kichraytirish kerak!


Agar biz brauzerga oddiy index.html fayl o'rniga .zip fayl jo'natsak (index.html.zip), biz ancha vaqtimizni tejagan bo'lamiz. Brauzerimiz zip faylni o'zi yuklab, zip fayldan chiqarib, saytni tez yuklanayotganidan hayratga tushayotgan foydalanuvchiga ko'rsatadi. Bu safar jarayon bunday kechadi:


Brauzer: Salom, menga index.html ni OLIB KELA OLASANMI? Agar optimallashtirilgani bo'lsa olib kel.

Server: Hozir faylni topib olay... ha, faylni topdim. Va sizga faylning optimallashgan (kichraytirilgan) turi kerak to'g'rimi? Ajoyib.

Server: Ho'sh, men index.html faylni topdim (200 ok), men uni zip qilib jo'nataman.

Brauzer: Juda zo'r! Atigi 10kb! Men endi buni foydalanuvchiga ko'rsataman.


Formula juda oddiy: Fayl optimalligi = tezroq yuklanish = foydalanuvchining xursand bo'lishi


Menga ishonmaysizmi? Yahoo bosh sahifasi optimallashtirilgach 101kb dan 15kb ga kichraydi:



Ba'zi bir tushunish qiyinroq bo'lgan narsalar

Bu jarayonning biroz qiyin jihati bu brauzer va serverning zip faylni bir biriga jo'nata olishi. Bu jarayon ikki qismdan iborat


  • Brauzer serverga optimallashtirilgan fayllarni qabul qilishi haqidagi ma'lumotni yuboradi:

Accept-Encoding: gzip, deflate


  • Server esa optimallashtirilgan fayllarni yuboradi:

Content-Encoding: gzip


Agar server hech qanday narsa jo'natmasa, bu server optimallashtirilgan fayllarni topa olmaganini bildiradi (bu ko'p serverlarda uchraydi). Brauzer faqatgina optimallashtirilgan fayllarni qabul qilishini aytib, so'rov yubora oladi. Agar server brauzerning bu so'roviga javob yubormasa, bu brauzerning ishini og'irlashtiradi.


Serverni sozlash

Afsuski biz bu holatda brauzerni nazorat qila olmaymiz. Lekin bizning vazifamiz serverni mana shu holatga sozlash bo'ladi, ya'ni server agar brauzer optimallashgan fayllar uchun so'rov yuborsa, serverimiz optimallashgan fayllarni yuborishi kerak. Bu esa tezlikni oshiradi va foydalanuvchilarga qulaylik keltiradi


Agar IIS ishlatsangiz, ushbu joydan sozlamalarni to'g'irlashingiz kerak.


Apache da esa, fayllarni optimizatsiya qilish juda ham oddiy. Shunchaki quyidagilarni .htaccess faylingizga qo'shing:

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>


Apacheda ikkita optimizatsiya usullari bor:

  • mod_deflate sozlashga oson va qulay
  • mod_gzip ancha murakkabroq: kontentni oldindan optimallashtirish mumkin


Deflate tez ishlaydi va o'zim ham foydalaman; agar sizga mod_gzip qulay bo'lsa ishlatishingiz mumkin. Ikkala holatda ham, Apache brauzer optimallashgan fayllar uchun so'rov yuborganmi yoki yo'qmi tekshiradi va agar yuborgan bo'lsa aynan optimallashgan yoki oddiy fayllarni brauzerga yuboradi. Lekin ba'zi eski brauzerlarda bu muammolarga olib kelishi mumkin (batafsil pastroqda) va bu muammolarni bir qancha yo'llar bilan hal qilish mumkin.


Agar siz .htaccess faylingizni o'zgartira olmasangiz, PHP dasturlash tilidan foydalanishingiz mumkin.


PHP orqali esa:

<?php if (substr_count($_SERVER[‘HTTP_ACCEPT_ENCODING’], ‘gzip’)) ob_start(“ob_gzhandler”); else ob_start(); ?>

Biz brauzer yuborgan so'rovni tekshiramiz va ushbu so'rovga mos ravishda optimallashgan fayllarni yuboramiz. Bu xuddi o'zingizni serveringizga o'xshaydi! Lekin odatda, bu narsa uchun Apache ishlatganingiz maqsadga muvofiq bo'ladi.


Optimallashgan fayllaringizni tekshiruvdan o'tkazing

Serverni sozlab bo'lgandan keyin, fayllaringiz rostan ham optimallashganiga ishonch hosil qilish uchun ularni tekshiruvdan o'tkazishingiz maqsadga muvofiq bo'ladi.

  • Online: online gzip test - ushbu havolaga kirib, fayllaringizni tekshiring
  • Brauzerda: Chromeda, Developer Tools ni oching (F12, Ctrl + Shift + i) > u yerdan Network Tab ga o'ting (Firefox va Internet Explorer da ham deyarli shunday). Sahifani yangilang (refresh), network (tarmoq) qismiga bosing. Agar u yerda “Content-encoding: gzip” yozuvini ko'rsangiz, demak fayllar optimallashgan. Keyin esa "Use large rows" tugmasiga bosing va barcha fayllar haqida to'liqroq ma'lumot oling. Siz bu yerda har bir faylning hajmini ko'rish imkoniga egasiz.


Natijalar hayratlanarli. Instacalcning bosh sahifasi hajmi 36k dan 10k ga tushi, ya'ni 75% kichraydi.


Ba'zi misollarni sinab ko'ring

Men ba'zi fayllar va ularni yuklash bo'yicha qo'llanma yaratdim:

  • index.html - hech qanday optimallashtirish yo'q
  • index.htm - Apache yordamida .htaccess orqali va .htm kengaytmasi yordamida optimallashtirilgan
  • index.php - PHP dasturlash tili yordamida optimallashtirilgan

Bemalol fayllarni yuklab olib o'z serveringizga qo'yib, sozlab, sinab ko'rishingiz mumkin.


Ehtiyot bo'lishingiz kerak bo'lgan ba'zi narsalar

Ajoyib ko'ringani bilan, optimallashtirish har doim ham biz kutgandek natija bermaydigan holatlar bor. Bu holatlar esa quyidagilar:


  • Eski brauzerlar: Ha, ba'zi eski brauzerlar optimallashtirilgan fayllar bilan ishlashda muammoga duch kelishi mumkin (ular optimallashgan faylni qabul qila olmaydi). Agar sizni saytingiz Netscape yoki Windows 95 da ishlashi kerak bo'lsa, fayllarni optimallashtirish mumkin emas. Apache mod_deflate da ba'zi muammolarga yechim sifatida maxsus qoidalar bor.
  • Allaqachon optimallashgan kontent: Ko'p rasmlar, audio yoki video fayllar doim avvaldan maksimum optimal holatga keltirilgan bo'ladi. Siz esa ularni qayta optimallashtirib vaqtingizni yutqazmasligingiz kerak. Aslida, siz shunchaki 3 ta eng umumiy fayllarni optimallashtirishingiz kerak: html, css, javascript
  • Protsessor: fayllarni optimallashtirish protsessordan ko'proq vaqt talab qilish orqali tezlikni oshiradi. Odatda bu tezlikni oshirish uchun juda ham foydali usul. Statik kontentni optimallashtirish va ularni jo'natishning bir qancha usullari mavjud. Bu esa ko'proq sozlamalarni talab qiladi; garchi bu imkonsiz bo'lsada, kontentni optimallashtirish katta yutuq bo'lishi mumkin. Protsessorga biroz og'irlik tushirgan holda foydalanuchi uchun saytni tezroq yuklash ancha foydali, internet olamida eng kam e'tibor beriladigan jihatlardan biri hisoblanadi.


Optimizatsiya bu saytingizni tezligini oshirishning eng yaxshi yo'llaridan biri. Optimizatsiyani o'rganing, foydalanuvchilaringizni hayratda qoldiring.


Shu mavzuga taalluqli postlar

HTTP Caching orqali saytingizni optimizatsiya qiling

Javascript fayllarni yuklanish tezligini oshirish

Javascript fayllarni yuklanish tezligini oshirish (2-qism)

Report Page