BeniBlog

Az egyik projecten dolgozgattam, minden faszán ment, aztán egyszercsak az ügyfél szólt, hogy valami nem jó a site-al, IE alatt nagyon lassú. Hát hajrá, nézzük meg mi a probléma. IE8 betölt, Developer Tools indít, Start Profiling.

Frissítek, erre a css nevű function csinál egy több mint 4 másodperces delay-t. Először azt hittem hogy valamimelyik jQuery scriptem valamelyik .css function része nem oké, és ott akad meg. No el is kezdtem kiszedegeti egyenként a plugineket (elég sokat használunk ezen a site-on), majd a colorbox kivétele után egyszercsak megszűnt a probléma. No akkor elkezdtem olvasgatni a forrását, hogy melyik functionja lehet a hibás… De valahogy nem találtam semmi komoly dolgot, ami kiakasztaná. Ellenben a hozzá tartozó CSS fájl!

A következő található a CSS fájl alján:

.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}

No megvan a kis dög! A Microsoft.AlphaImageLoader(); metódus a hibás, ha kivettem ezeket a sorokat, azonnal felgyorsult a site, a profilerben sem látszott hatalmas hézag, mint előtte. No de akkor most mi a megoldás? IE-t ne támogassuk és kész? Ez nem épp egy elfogadható eredmény. Megnéztem a colorboxot IE-ben, és egy kicsit máshogy néz ki mint firefoxban például… Akkor itt a kérdés, hogy ezek a sorok ugyan miért is vannak, ha így se ugyanaz?

Újabb fejvakarás, és 10 perc vad Google keresés után jött a megoldás: A css fájlban ha megadunk egy háttérképet mondjuk, azt mindig a css-fájlhoz képest keresi, míg a Microsoft.AlphaImageLoader(); pont nem így működik, ő az URL-hez képest keresi ugyanezeket a fájlokat, és ez hiányzó kép rögtön egy nagy kését okoz ennek a metódusnak (juipjé Microsoft). Így tehát (mint esetemben), ha a css-t nem a gyökérben tárolod, hanem egy /css/style.css helyen például, akkor az AlphaImageLoader már ki fog akadni. Minden kedves webfejlesztőnek ajánlom hogy figyeljen oda erre, mert nagyon idegesítő problémákat fog okozni!

Ez egy ingyenes HTML, CSS, AJAX, Mootools, Scriptaculous, stb.. könyv. Olvasgassatok.

http://woork.blogspot.com/2009/01/woork-handbook.html

beni@zion:~$ cat /proc/acpi/battery/BAT1/info
present:                 yes
design capacity:         5100 mAh
last full capacity:      5100 mAh
battery technology:      rechargeable
….

szeressük ezt, az akksi, mint az új.

48 words

Speedtest

bezonybezony…