Veb saytlarni ishlashishini tezlashtirish muammolari va ularning yechimlari. “InfoCOM.UZ” saytining kamchiliklari va ularni bartaraf etish usullari
21.12.2009
Rukn: Tanlovga yuborilgan maqolalar.
Muallif: Asror Zokirov.

uchastnik Ushbu maqola O‘zbekistondagi veb resurslarning ishlashishini tezlashtirishdagi mavjud muammolar va ularning yechimlari, xususan bu boradagi universal texnologiyalar, metodlar, klassifikatsiyalar va dasturchilar uchun kerakli maslaxatlarni o‘z ichiga oladi. Maqolaning tadqiqot obyekti sifatida “INFOCOM.UZ” sayti tanlab olindi va quyida bu saytning yuklanish tezligiga ta’sir etuvchi kamchiliklar va ularni bartaraf etish usullari keltirib o‘tilgan.

1. Kirish
Yildan yilga internet tarmog‘i faqat oldinga qarab ildam qadam tashlamoqda. Shu bilan birga hozirgi kunda O‘znetda yaratilayotgan saytlar ham o‘z dizayni, funksional qismi, integratsiyalashgan modullari bilan internet tarmog‘idagi boshqa davlatlar (Russia, USA, Germany, Korea va h.k.) veb dasturlari bilan tenglashmoqda.

Hozirgi kunda O‘zbekistonda keng tarqalgan (aniqrog‘i 40% da ortiq foydalanuvchilar orasida) internet xizmatlari:
• Elektron pochta orqali xat yoki fayllar yuborish (Mail.ru, Pochta.ru, Gmail.com, Ramber.ru, Inbox.uz, …);
• Turli messendjerlardan foydalangan holda onlayn muloqot qilish (Mail.ru agent, Scype, Google talk, Qip, MSN, ….);
• Ma’lumotlar qidiruvi (Google.com, Rambler.ru, Nigma.ru, b2b.com, Yandex.ru);
• “E – Commerce” tizimiga asoslangan saytlar (Torg.uz, Zor.uz, Alo.uz, List.uz, …);
• To‘lov tizimlari (PayNet,, Payment-plyus);
• Tarjima portallari (Uz-Translations — языковой портал);
• Onlayn chat tizimlari (Chat.uz, Narod.uz, …);
Bundan tashqari O‘znet (O‘zbekiston Interneti) foydalanuvchilari va asosan talaba, o‘quvchilar asosida orasida Kompyuter va Axborot texnologiyalari bo‘yicha kengroq ma’lumot olish mumkin bo‘lgan resurslar (ref.uz, Uforum.uz,…) ham ma’lum va mashxur. Shu qatorga ajoyib www.infocom.uz veb saytini ham qo‘shish mumkin.

2. Mavjud muammoning tahlili
O‘z o‘quv mashg‘ulotlarim va qiziqishlarim yuzasidan “Infocom”ning rasmiy veb sayti http://www.infocom.uz ga ko‘p qadam ranjida qilaman. Bu saytda men uchun qiziqarli va muhim ma’lumotlar tez tez chop etiladi. Bundan tashqari “Infocom”ning barcha sonlarini qoldirmay o‘qib borishga harakat qilaman. Saytni dizayni va kontenti yomon emas, ammo…!

Dasturlash tillari va server texnologiyalarining rivojlanishi, mukammal CMS (Content Management System)lar yaratilishi bilan bir qatorda quyidagi aspektlar ham mavjudki, ularga e’tibor bermaslikning iloji yo‘q.

Statistik ma’lumot
Oxirgi 5 yilda veb saxifalarning o‘rtacha xajmi 3 barobar ortgan. Oxirgi yarim yillikda esa taxminan1,5 barobarga ortgan.

Bunga asosiy sabab quyidagilar hisoblanadi:
• Ajoyib dizaynni yaratish uchun o‘nlab rasmlar, kaskadli stil jadvallari (CSS) va ayrim hollarda javascript (JS) lardan keng foydalanilmoqda.
• Saytlar ishlash prinsiplari murakkab tizimga asoslangan, Javascript yordamida ko‘plab hisoblashlar olib boriladi;
• O‘znet dagi saytlarni ko‘pchiligida katta o‘lchamli multimedia fayllar (Flash, Images, Video) keng qo‘llanilmoqda;
• Saytlardagi asosiy html fayl o‘lchami ham bir necha barobarga ortdi;
• Yuqoridagilardan kelib chiqib saytlarning umumiy o‘lchamlari ham ortib bormoqda.

Statistik ma’lumot
O‘znetdagi saytlardagi har bir veb saxifa o‘rtacha 40 ta obyekt (Rasmlar, Multimedia fayllar, JavaScriptlar, CSS lar) bilan birgalikda yuklanadi va bu saytni umumiy yuklanish vaqtiga o‘ta salbiy ta’sir ko‘rsatadi.

O‘znetdagi ko‘plab saytlar chiroyli va ma’lumotlarga boy bo‘lishi bilan birga yetarli darajada “og‘ir” hamdir. “Og‘ir” deyishimni sababi foydalanuvchi brauzer (Opera, Firefox, Safari, IE) adres qatoriga www..uz deb yozishidan to sayt kompyuuterga yuklanguncha yetarli darajada ko‘p vaqt o‘tadi.

Hozir men o‘z bilim va tajribamdan kelib chiqqan holda bu muammoni to‘liq tahlil qilib, uni yechimini topishga harakat qilaman!
Ammo buning uchun internetdagi http,https protokolidan foydalanuvchi veb dasturlar qanday ishlashi haqida va saytni optimizatsiya qilish uchun qaysi aspektlarga e’tibor qaratishni aniqlashtirib olsak.

Umuman olganda biz foydalanadigan veb xizmatlar (saytlar, onlayn test tizimlari va h.k.) “Mijoz — Server” arxitekturasiga asoslangan va veb saxifalarni o‘zi ham statik yoki dinamik bo‘lishi mumkin.

Statik veb saxifalar:
• Asosan “Sayt – vizitka” yoki “Portfolio” tipidagi saytlarda keng qo‘llaniladi.
• Faqatgina HTML hujjat (.html, .htm, .vml, .xhtml, .xml) va Multimedia fayllar, JavaScriptlar, CSS lardan iborat bo‘ladi.
• Foydalanuvchi harakatiga (Masalan formaga qandaydir yozuv yozib Enter in bosdingiz) server orqali javob qaytara olmaydi.
• Yaratish nisbatan oson (WYSIWYG editorlar yoki MS Word yordamida yoki notepadda)

Dinamik veb saxifalar:
• Ulkan veb portal, Internet magazin, Sotsial tarmoq va h.k. lar yaratishda qo‘llaniladi.
• Yozishda server script turlari (PHP, PERL, ColdFusion, ASP, ASP.NET va h.k.) ishlatiladi.
• HTML saxifalar dinamik ravishda server (Apache, Share Point yoki Nginx) yordamida generatsiya qilinadi.
• Relyatsion yoki obyektga yo‘naltirilgan ma’lumotlar bazasidan foydalanadi (MySQl, MsSQL, PostGreSQL va h.k.)
• Foydalanuvchi harakatiga (Masalan textboxga qandaydir yozuv yozib Enter in bosdingiz) server orqali javob qaytaradi (sinxron yoki asinxron).
• Yaratish murakkabroq: dasturchi tezroq ishlashi uchun “Web Developer” tipidagi dasturlar (PHP Designer, Adobe Dreamveawer, MS Visual Studio 2008 va h.k.) dan foydalanish kerak.

Yuqorida biz HTML saxifalar dinamik ravishda server (Apache, Share Point yoki Ngnix) yordamida generatsiya qilinadi deb aytib o‘tdik:

Bu gapga misol sifatida PHP tilida yozilgan dasturni Apache serverdagi generatsiyasini ko‘rsatib o‘taman:

Misol uchun quyidagi oddiy php koddan foydalanamiz

web_29_12_2009

Bu PHP kod server (Apache) tomonida generatsiya qilinib quyidagi HTML kodni foydalanuvchiga uzatadi:

web_29_12_2009_1

Brauzerda yuqoridagi HTML kod hosil qilgan yozuv

web_29_12_2009_2

Saytni yuklanishiga ketgan umumiy vaqtning faqatgina 5-20 % serverga (kodni generatsiyasiga) to‘g‘ri keladi. Bu tahminan 50-300 ms ni tashkil etadi. Qolgan vaqt esa Mijoz arxitekturasi va kanalning o‘tkazish qobiliyati (internet tezligi) ga bog‘liqdir.

Tadqiqotlarga ko‘ra agar sizni saytingizni to‘liq yuklanishi (Hamma elementlar bilan) uchun ketgan vaqt 8-10 soniyadan ortsa va shu jarayonda sayt yuklanayotgani haqida (“Loading.. Please wait” kabi) hech qanday yozuv berilmasa, bu narsa foydalanuvchini esdan og‘dirib qo‘yishi mumkin ekan !

Bundan tashqari xDSL yoki FTTx internet foydalanuvchilari Dial – up foydalanuvchilariga qaraganda saytni sekin ishlashiga yanada talabchan ekanlar. 2008 yili o‘tkazilgna so‘rovlar natijasida shu narsa ma’lum bo‘ldiki 33% yuqori tezlikdagi internet foydalanuvchilari sayt yuklanishini 4 soniyadan, 43% esa 6 soniyadan ortiq kutishni xohlamaydilar. Bunday hollarda foydalanuvchi 5-8 soniya davomida ekranda sayt ko‘rinmasa shartta brauzerni ‘o‘chirishadi yoki bo‘shqa saytga o‘tib ketishadi.

Bu yerda har bir mikrosekund oltinda tengdir. Ko‘plab sondagi foydalanuvchilarga ega Google, Amazon, Flickr, Netflix, Яндекс, вКонтакте va Одноклассники, MAIL.ru kabi veb portallar o‘z saytlarini yuklanish tezligiga katta e’tibor qaratadilar. Chunki bu saytlar bir biriga o‘xshamasa xam, ularga 1 kunda 1000 tadan ko‘p odam kiradi. Bu hozirgi bozor iqtisodiyoti va katta raqobat holatida eng to‘g‘ri qarordir. Chunki saytni yuklanishiga ketgan har bir ortiqcha mikrosekund yuzlab yo‘qotilgan foydalanuvchilarga teng bo‘lishi mumkin.

Shunday qilib sizda yoki sizning kompaniyangizda veb sayt bor va siz uni ishlash tezligidan qoniqmayapsiz. Xo‘sh nima qilish kerak? Qanday qilib saytni “Raketa” darajasiga yetkazish mumkin? Imkoni yo‘q narsani o‘zi yo‘q! Ammo ishni avvalo mavjud saytni chuqur o‘rganib chiqishdan boshlash kerak.

Eslatma! Ushbu maqolam uchun tadqiqot obyekti sifatida O‘znetdagi qiziqarli saytlardan biri — http://www.infocom.uz saytini tanlab oldim!

Bunday qilishimdan maqsad men olib borgan izlanishlar keyinchalik bu sayt ravnaqiga hissa qo‘shishini juda xoxlardim.

Shunday qilib ishni boshladik! >>>

Bu masalada biz kerakli dasturiy ta’minot kompyuterimizga o‘rnatamiz. Bundan tashqari veb saytlarni onlayn analizi uchun http://webpagetest.org/, http://site-perf.com/ yoki http://webo.in kabi veb xizmatlardan foydalanish mumkin

Zaruriy dasturiy ta’minot:

Firefox Mozilla 3.5 Brauzeri. Bu brauzer o‘zining ishonchliligi va ajoyib pluginlari bilan e’tiborni qozonadi.

web_29_12_2009_3

Web Developer Toolbar v1.1.8 (http://chrispederick.com/work/web-developer/)

Bu instrumentlar paneli brauzerda yuklangan veb saytlarni html kodi ustida ishlash uchun kerak.

web_29_12_2009_4

Firebug 1.4.5 (http://getfirebug.com/)

Firebug yordamida istalgan hajmdagi html, css, js kod bilan ishlash mumkin. Bundan tashqari uning 10 dan ziyod ajoyib imkoniyatlari bor va biz ular bilan ish jarayonida tanishamiz.

web_29_12_2009_5

Live HTTP Headers v2 (http://livehttpheaders.mozdev.org/)

Live HTTP Headers plugini yordamida biror saytning serveri tomonidan yuborilgan sarlavha (header) larni aniq ko‘rish mumkin.

web_29_12_2009_6

YSlow (http://developer.yahoo.com/yslow/) Firefox ning Yslow plugini ham veb saytlarni analizida dasturchilarni qo‘lidagi muhim uskuna hisoblanadi. Uni yordamida saytning html kodi bilan yuklanayotgan barcha obyektlar haqida to‘liq ma’lumot olish mumkin.

web_29_12_2009_7

PHP Designer 2008. Veb dasturlash tillari bilan ishlash uchun juda qulay dasturiy ta’minot (IDEA)

web_29_12_2009_8

Adobe Dreamveawer CS4. Veb dasturlash tillari va Kaskadli stillar jadvali (CSS) bilan vizual ishlash uchun juda qulay dasturiy ta’minot (IDEA).

web_29_12_2009_9

Hullas foydalaniladigan dasturlarni aniqlab oldik. Bu dasturlarning barchasi istalgan murakkablikdagi veb loyihalar ustida ishlashda dasturchiga kerak bo‘ladi.

Men http://infocom.uz saytining har tomonlama analizi uchun yuqoridagi dasturlardan va veb servislardan foydalandim.

http://infocom.uz saytining analizi natijalari

web_29_12_2009_10
web_29_12_2009_11

web_29_12_2009_12

http://infocom.uz veb serverining analizi

web_29_12_2009_13

http://infocom.uz saytini qanchalik tezlashtirish mumkin?

web_29_12_2009_14

Men http://infocom.uz saytida, uni yuklanish tezligiga jiddiy ta’sir ko‘rsatuvchi quyidagi muammolarni aniqladim:

• HTML fayllarni o‘lchami haddan tashqari katta. (116 kb )
• HTML fayllar uchun GZIP algoritmi ishlatilmagan.
• CSS fayllarni o‘lchamini kichraytirsa bo‘ladi.
• CSS fayllarni soni 1 ta dan ko‘p.
• Statik fayllar uchun Kesh funksiyasi yoqilmagan
• Sayt uchun ETag yoki Last-Modified sarlavhalari yoqilmagan
• JavaScript fayllarni o‘lchamini juda katta (175 kb !)
• JavaScript fayllarni soni 1 tadan ko‘p (7 ta !)
• Serverga dublikat so‘rovlar bo‘lmoqda, ya’ni bitta CSS yoki JS fayl 2< ta joyda kiritilgan (Jiddiy xato) • Ayrim GIF rasmlarni o‘lchamini kichraytirsa bo‘ladi • Ayrim JPEG rasmlarni o‘lchamini kichraytirsa bo‘ladi • Ayrim PNG rasmlarni o‘lchamini kichraytirsa bo‘ladi • FON uchun 1 tadan ortiq rasm yuklanmoqda • Javascript kutubxona (JS LIBRARY) sifatida SAMARASI KAM bo‘lgan “Prototype” ishlatilgan. (121 kb) Eslatma:
Yuqoridagi muammolarni o‘znetdagi ko‘plab saytlarda kuzatish mumkin.
Gapimning isboti sifatida 5 – bo‘limda o‘znetdagi eng mashxur 4 ta saytning integral analizini ko‘rib chiqishingiz mumkin!

O‘z saytining ravnaqi uchun harakat qiladigan har bir “VebMaster” (Adminstrator yoki dasturchi) da quyidagi kabi savollar tug‘ilishi tabiiy.

• Xo‘sh bu muammolarni qanday hal qilish mumkin?
• Ularni barchasini bartaraf etish uchun qancha vaqt ketadi?
• Bu ish yuzasidan kimga murojaat etish mumkin?

Quyida men ularga atroflicha javob berishga, veb sayt yuklanish tezligi bilan bog‘liq muammolarning texnologik yechimlari bilan sizlarni tanishtirib o‘tishga harakat qilaman.

Faqat har bir punktga alohida e’tibor qaratishingizni so‘rab qolaman.

3. O‘znetdagi veb saytlar tezkor yuklanishini ta’minlashning texnologik tomonlari:

Veb saytni optimallashtirish va tezlashtirishni asosiy metodlari:
Bu metodlarni mos ravishda 4 ta guruxga ajratish mumkin.

1. Yuklanuvchi ma’lumotlarni hajmini kamaytirish (Turli kompressiya algoritmlaridan foydalangan holda).
2. Yuklangan ma’lumotlarni keshda saqlab qo‘yish (Juftlik server-mijoz “HEADER” sarlavhalar uzatgan holda).
3. Umumiy yuklanuvchi fayllar sonini kamaytirish (Fayllarni o‘zaro birlashtirish usuli bilan).
4. “Vizual” tezlashtirish usuli (Fayllarni turli hostlardan yuklash.)

3.1. Yuklanuvchi ma’lumotlarni hajmini kamaytirish:

web_29_12_2009_15

3.1.1. HTML kodni Gzip-deflate algoritmlari bilan siqish (kichraytirish)
Buning uchun 2 ta metod qo‘llash mumkin:

• HTML faylni Apache SERVER vositasida “Gzip” lash (Yoki deflate)
• HTML faylni PHP vositasida “Gzip” lash (Yoki deflate)

web_29_12_2009_16

HTML faylni Apache SERVER vositasida “Gzip” lash (Yoki deflate) hozir deyarli qo‘llanilmaydi, shu sababli 2-metodni ko‘rib chiqamiz:

2-metod: Asosiy Index.php fayliga quyidagi kodni kiritamiz:


<?php
header(«Content-type: text/html; charset=utf-8»);
define(«ASROR_ADMIN»,true);
if (strpos(‘ ‘.$_SERVER[‘HTTP_ACCEPT_ENCODING‘],’x-gzip’) !== false)
{
$encoding = ‘x-gzip’;
}
if (strpos(‘ ‘.$_SERVER[‘HTTP_ACCEPT_ENCODING‘],’gzip’) !== false)
{
$encoding = ‘gzip’;
}
if (isset($encoding))
{
ob_start();
}
function percent($a,$b)
{
$c = $b / $a * 100;
return $c;
}
?>
SHU YERDA NIMANIDIR YOZASIZ !
YA’NI HTML KOD JOYLASHTIRASIZ !
<?
if (isset($encoding))
{
$content = ob_get_contents();
$contentlenn = strlen($content);
$out = gzencode($content,9);
$len = strlen($out);
$content_strlen = strlen($content);
$gzpercent = percent($content_strlen,$len);
$percent = round($gzpercent);
$content = str_replace(‘<!- GZipper_Stats ->‘,’Original size: ‘.strlen($content).
‘ GZipped size: ‘.$len.’ Сompression: ‘.$percent.’%<hr>‘,$content);
$out = gzencode($content,9);
ob_clean();
header(‘Content-Encoding: ‘.$encoding);
echo $out;
}
?>

Bunda sayt tarkibidagi matn gzip yoki deflate algoritmlari bilan siqilib brauzerga uzatiladi. Brauzer “header(“Content encoding: gzip”)” deb yozilgan kodga asoslanib bu matnni yana html kod shakliga keltiradi

Bu usul html yoki xml xujjatlarni o‘lchamini kamaytirishda ancha samaralidir – 80%.


3.1.2 CSS va JavaScript larni Serverdan Gzip-deflate algoritmlari bilan kichraytirish

Buning uchun sayt joylashgan asosiy direktoriyaga quyidagi kod yozilgan .htaccees faylini ko‘chirib qo‘yish kerak:


AddEncoding gzip .gz
RewriteEngine On
RewriteBase /
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Konqueror
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)\.css$ $1.css.gz [QSA,L]
<FilesMatch \.css\.gz$>
ForceType text/css
</FilesMatch>
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{HTTP_USER_AGENT} !Konqueror
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)\.js$ $1.js.gz [QSA,L]
<FilesMatch \.js\.gz$>
ForceType application/x-javascript
</FilesMatch>

Bu usul CSS va JavaScript xujjatlarni o‘lchamini kamaytirishda ancha samaralidir – 70%.

3.1.3 CSS larni minimizatsiya qilish

web_29_12_2009_17

Bunda CSS fayllar uchun CSS Tidy dasturidan foydalanamiz. Uni ishlash jarayoni quyida ko‘rsatilgan:

web_29_12_2009_18
web_29_12_2009_19

Bu usul CSS xujjatlarni o‘lchamini kamaytirishda maksimum 40% samara beradi.

3.1.4 JavaScript larni minimizatsiya qilish

Bunda JavaScript fayllar uchun Dean Edvards Packer dasturi dan foydalanaman. Unda ishlash jarayoni quyida ko‘rsatilgan:

web_29_12_2009_20
web_29_12_2009_21

Bu usul JavaScript xujjatlarni o‘lchamini kamaytirishda maksimum 23% samara beradi.

3.1.4 Rasmlar (PNG,JPG,BMP,GIF..) ni optimizatsiya qilish

web_29_12_2009_22

Bunda RASM fayllari JPEG, PNG, PNG-24, BMP, GIF tarkibidagi quyidagi ma’lumotlar olib tashlanadi

• Turli kommentariylar
• Qo‘shimcha ma’lumotlar
• Ortiqcha piksellar
• Foydalanilmaydigan palitralar
So‘ngra fayl yangi nom bilan saqlanadi.

Bu maqsad uchun quyidagi dasturlardan foydalanish mumkin:
• GIF: Adobe Photoshop [Lossy], Ultra GIF Optimizer 1.02, SuperGIF 1.5, GIFLite 2.10
• PNG: optipng 0.6.3, pngcrush 1.6.15, pngoutwin 1.0.1
• JPEG: Adobe Photoshop CS2, GIMP 2.6.6, Xat JPEG Optimizer

3.2 Yuklangan ma’lumotlarni keshda saqlab qo‘yish

3.2.1 Statik fayllarni keshda saqlab qo‘yish

web_29_12_2009_23

Bu usul statik saxifalar va fayllar uchun keng qo‘llaniladi. Masalan umuman o‘zgarmaydigan rasmlar, Javascriptlar, Css lar uchun. Bu elementlar uchun umumiy yechim quyida ko‘rsatilgan. Sayt joylashgan asosiy direktoriyaga quyidagi kod yozilgan .htaccees faylini ko‘chirib qo‘yish kerak:


ExpiresActive On
ExpiresDefault «access plus 10 years»
<FilesMatch \.(php|phtml|shtml|html|xml)$>
ExpiresActive Off
</FilesMatch>
<FilesMatch \.(php|phtml|shtml|html|xml)$>
Header append Vary User-Agent
Header append Cache-Control private
</FilesMatch>
<FilesMatch \.(bmp|png|gif|jpeg|ico|flv|wmf|swf|pdf|doc|rtf|css|js)$>
Header append Cache-Control public
</FilesMatch>
<FilesMatch \.(js|css|bmp|png|gif|jpeg|ico|flv|wmf|swf|pdf|doc|rtf)$>
Header unset Last-Modified
FileETag MTime
</FilesMatch>
ExpiresByType image/jpeg «access plus 333 day»
ExpiresByType image/gif «access plus 333 day»
ExpiresByType image/png «access plus 333 day»
ExpiresByType text/css «access plus 333 day»

Muhim eslatma:
Bu kesh uchun yozilgan dastur to‘g‘ri ishlashi uchun Apache serverda kerakli modullar (mod_header, mod_expires) o‘rnatilgan va yoqilgan bo‘lishi lozim!

3.2.2 E-tag yoki Last Modified sarlavhalarini qo‘llash:

E-tag – bu serverni hr bir fayl versiyasini ideintifikatsiya qilish uchun Veb Server (Apache) tomonidan brauzerga uzatiladi:

HTTP/1.1 200 OK
Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
ETag: «10c24bc-4ab-457e1c1f» <<
Content-Length: 12195

Keyinroq agar brauzer komponentning aktualligini tekshirib ko‘rmoqchi bo‘lsa u If-None-Match sarlavhasini yuboradi.
So‘ngra brauzer If-None-Match ni E-tag bilan solishtiradi, agarda ular o‘zaro teng bo‘lsa serverdan 304 statusli kod qabul qilinadi.

GET /i/yahoo.gif HTTP/1.1
Host: us.yimg.com
If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
If-None-Match: «10c24bc-4ab-457e1c1f»
HTTP/1.1 304 Not Modified

Muhim eslatma:
Apache serverda E-tag ni yo‘qib qo‘yish uchun quyidagi kodni .htaccess ga kiriting:

FileETag MTime Size

Last modified texnologiyasi E-tagning kloni hisoblanadi va agarda siz E-tag dan foydalansangiz Last-modified ga zarurat yo‘q

Muhim eslatma:
HTML fayllar uchun kech funksiyasini o‘chirib qo‘yishni maslaxat beramn. (Boshqa fayllarga yoqish mumkin). Chunki BackEnd faqatgina html fayldan iborat bo‘ladi

3.3 Umumiy yuklanuvchi fayllar sonini kamaytirish (Fayllarni o‘zaro birlashtirish usuli bilan).

web_29_12_2009_24

3.3.1 Css Sprites: Bunda saytingizda ishlatilayotgan barcha rasmlarni 1 ta rasmga birlashtirib, so‘ngra CSS[Background-image, Background-position] yordamida undan rasmlar ajratib olinadi.

web_29_12_2009_25

Agar bu rasmlarni yaratishga vaqtingiz bo‘lmasa CSS Sprite generator.. Servisidan foydalanish mumkin.

3.3.2 Image-Map: Bunda sayt uchun bitta katta o‘lchamdagi rasm ishlatiladi. Barcha ssilkalar esa

tegi yordamida yaratiladi

web_29_12_2009_26

3.3.3 Data:URL: Bunda rasmlar <img src=””> tegi yordamida emas, shifrlangan holda

<img src=»data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7″ width=»16″ height=»14″ alt=»ASROR»/>

Buni natijasida web_29_12_2009_27 rasm paydo bo‘ladi.

3.4. “Vizual” tezlashtirish usuli (Fayllarni turli hostlardan yuklash.)
Masalan: Rasmlarni www.a1.infocom.uz dan, JS larni www.a2.infocom.uz dan va h.k.). Chunki HTTP 1.1 protokoli shunday tuzilganki, brauzerlar bir vaqtda bitta hostdan (masalan: www.infocom.uz) faqat 2 ta faylni ko‘chirishi mumkin.

Bu degani brauzer (Firefox yoki IE ) 2 ta “katta vaznli” JS,CSS yoki rasmni ko‘chirib olmaguncha sayt sizga “qorasini ham ko‘rsatmaydi” deganidir.

Skrinshotda Fayllarning yuklanish ketma ketligi ko‘rsatib o‘tilgan.

web_29_12_2009_28

Endi esa tajribamiz obyekti http://infocom.uz sayti muammolariga qaytsak:

4. http://infocom.uz saytini 3.1 marta (307% ga) tezlashtirish uchun qanday ishlarni amalga oshirish kerak?

Zaruriy vazifalar:

• HTML fayllarni o‘lchamini kichraytirish kerak
• CSS fayllarni o‘lchamini kichraytirish kerak
• CSS fayllarni o‘zaro birlashtirish kerak
• Statik fayllar uchun Keshga kirgizuvchi sarlavhalardan foydalanish kerak
• Sayt uchun ETag yoki Last-Modified sarlavhalarini qo‘llash kerak.
• JavaScript fayllarni o‘lchamini kichraytirish kerak
• JavaScript fayllarni o‘zaro birlashtirish kerak
• Serverga dublikat so‘rovlarni yo‘qotish kerak.
• GIF rasmlarni o‘lchamini qisqartirish kerak
• JPEG rasmlarni o‘lchamini qisqartirish kerak
• PNG rasmlarni o‘lchamini qisqartirish kerak

Maslahatlar:

• HTML kodidan event-handler (onclick, onmouseover) kodlarini olib tashlash
• Multimedia fayllarini o‘lchamini kichraytirish kerak
• Fondagi rasmlarni sonini kamaytirish yoki DATA:URL texnologiyasini qo‘llash kerak
• Javascript kutubxona (JS LIBRARY) sifatida “Prototype.js” ni emas “Jquery.js” dan foydalanish kerak (Eslatma: Bunda WordPress ni html kodida ancha narsani o‘zgartirish kerak)

Shu tarzda http://infocom.uz saytining yuklanish tezligiga jiddiy ta’sir ko‘rsatuvchi muammolarni bartaraf etish uchun qanday ishlar amalga oshirilishi zarur ekanligini ham aniqlab oldik. Bu jarayonda shu maqoladan yoki eng quyida ko‘rsatib o‘tilgan manbalardan foydalanish mumkin.

Men yuqorida O‘znetdagi ko‘p saytlarda “muammoli vaziyatlar mavjud” deb aytib o‘tdim. Shu gapning isboti sifatida O‘zbekistondagi eng mashxur 4 ta saytning integral analizini e’tiboringizga havola etaman!

5. O‘znetdagi mashxur 4 ta sayt yuklanish tezligining integral analizi

http://torg.uz saytining analizi natijalari

web_29_12_2009_29
web_29_12_2009_30

http://torg.uz saytini qanchalik tezlashtirish mumkin?

web_29_12_2009_31

http://ziyonet.uz saytining analizi natijalari

web_29_12_2009_32
web_29_12_2009_33

http://ziyonet.uz saytini qanchalik tezlashtirish mumkin?

web_29_12_2009_34

http://uforum.uz saytining analizi natijalari

web_29_12_2009_35
web_29_12_2009_36

http://uforum.uz saytini qanchalik tezlashtirish mumkin?

web_29_12_2009_37

http://cert.uz saytining analizi natijalari

web_29_12_2009_38
web_29_12_2009_39

http://cert.uz saytini qanchalik tezlashtirish mumkin?

web_29_12_2009_40

Xulosa: Shunday qilib oldimizga qo‘yilgan maqsad: Veb saytlarni ishlashishini tezlashtirish muammolari va ularning yechimlari va “infocom.uz” saytining kamchiliklari va ularni bartaraf etish usullarini batafsil yoritib berdim deb o‘ylayman. Agar bu maqolam siz uchun foydali bo‘lgan bo‘lsa “boshim osmonga yetdi”.

Veb saytlar chiroyli bo‘lish bilan birga tezkor bo‘lsa internet foydalanuvchilarining ularga bo‘lgan ishonchi yanada ortadi.

Foydalanilgan adabiyotlar!
• “Average Web Page Size Triples Since 2003” // Web Site Optimization. — http://www.websiteoptimization.com/speed/tweak/average-web-page/.
• “Best Practices for Speeding Up Your Web Site” // Yahoo!. — http://developer.yahoo.com/performance/rules.html.
• Bouch, A., Kuchinsky, A., Bhatti, N. , “Quality is in the Eye of the Beholder: Meeting Users’ Requirements for Internet Quality of Service” // CHI. — The Hague, The Netherlands : [б.н.], 2000 r..
• “Retail Web Site Performance: Consumer Reaction to a Poor Online Shopping Experience” // Akamai. — 2006 r..
• Nah, F., “A study on tolerable waiting time: how long are Web users willing to wait?” // Behaviour. — [б.м.] : Information Technology, 2004 r.. — 23 : Т. 3.
• Galletta, D., Henry, R., McCoy, S., Polak, P., “Web Site Delays: How Tolerant are Users?” // Journal of the Association for Information Systems. — 5 : Т. 1.
• “The Psychology of Web Performance” // Web Site Optimization. — http://www.websiteoptimization.com/speed/tweak/psychology-web-performance/.
• “CSS Tidy” // Soureforge. — http://csstidy.sourceforge.net/.
• “YUI Compressor” // Yahoo!. — http://developer.yahoo.com/compressor/.
• “Dean Edwards Packer” // Dean Edwards. — http://dean.edwards.name/packer/.
• “Replace GIF with PNG Images” // Web Site Optimization. — http://www.websiteoptimization.com/speed/tweak/png/.
• “Optimize Parallel Downloads to Minimize Object Overhead” // Web Site Optimization. — http://www.websiteoptimization.com/speed/tweak/parallel/.
• “Non-blocking JavaScript Downloads” // Yahoo! User Interfacses Blog. — http://yuiblog.com/blog/2008/07/22/non-blocking-scripts/.
• “High Performance Ajax Applications” // Julien Lecompte Blog. — http://www.julienlecomte.net/blog/2007/12/39/.
http://speedupyourwebsite.ru/books/reactive-websites/
http://speedupyourwebsite.ru/books/speed-up-your-website/
http://webo.in
http://webo.in/articles/habrahabr/99-web-optimizer-installation-0.5/
http://webo.in/articles/habrahabr/03-presentation-layer-performance-tuning/
http://webo.in/articles/habrahabr/15-yahoo-best-practices/

Скачать эту статью на русском

Orphus system
O'zbеkistonda AKT yangiliklaridan birinchilar qatorida xabardor bo'lish uchun Telegramda infoCOM.UZ kanaliga obuna bo'ling.
Telegramga qo`shmoq
WhatsAppga qo`shmoq
Odnoklassnikiga yubormoq
VKontakteda bo`lishmoq