ugrás a tartalomhoz

Stop using poor performance CSS expressions - Use JavaScript instead

Joó Ádám · 2007. Nov. 14. (Sze), 07.57
Használjunk JavaScriptet a CSS kifejezések helyett
 
1

azért ez nem ilyen egyszerű...

wiktor · 2007. Nov. 14. (Sze), 12.15
A cikkben példa nem kicsit sarkos és csúnyán leegyszerűsíti a témát. Sokkal inkább arról van itt szó, hogy a css expression-ök lehetnek baromi lassúak is, de nem feltétlenül azok!

Csodálom, hogy elfelejti megemlíteni Dean Edwards tavalyi cikkét, amiben Dean pont arra hívja fel a figyelmet, hogy a belső css motor kb. négyszer gyorsabb, mint a dom-os js keresések.

This piece of CSS and JavaScript leverages the speed of IE’s internal CSS engine. It is pretty fast. About four times faster than a DOM query.

http://dean.edwards.name/weblog/2006/03/faster/

Ami ugye azt jelenti, hogy ha nem egy id-vel ellátott elemet kell felprogramozni, hanem mondjuk 50 linket, képet, akármit, akkor bizony-bizony az expressionök célravezetők.

Azzal se értek egyet, hogy feltétlenül kell figyelni arra, hogy mi van akkor ha nincs js, hiszen egy admin oldalon vagy egy belső rendszernél a legtöbb esetben nem szempont. Ilyenkor pontosan az számít, hogy gyors legyen a betöltődés és a működés is, bármi áron.

Feketén-fehéren mutatja be a cikk a témát, ahelyett, hogy a lehetséges veszélyekre hivná fel a figyelmet és azt is bemutatná, hogy bizonyos esetekben igenis van ezeknek létjogosultsága.
3

JS motor

Joó Ádám · 2007. Nov. 14. (Sze), 17.31
Épp azt írja, hogy az expressionök a JavaScript motort használják.
4

persze

wiktor · 2007. Nov. 14. (Sze), 19.31
Nyilván azt használják, ez nem is kérdés. A kérdés az, hogy a célzott elemeket te találod-e meg gyorsabban javascriptből vagy maga a böngésző, amikor értelmezi a CSS kiválasztót. Erre a kérdésre pedig az a válasz, hogy a böngésző. Vannak olyan esetek, amikor nem célszerű használni, de ahogy Fraki is mondja, ettől még nem lesz belőle törvény... Soha ne mondd, hogy soha... :)
6

Nem megtalálás a probléma

Jano · 2007. Nov. 14. (Sze), 20.05
Nem az egyszeri megtalálás a probléma. A css expressiont esetleg minden egyes egérmozdításnál ki kell értékelnie a böngészőnek általában teljesen felesleges. Pl: az van az exressionodben, hogy az egyik elem színe legyen olyan mint a melette levő linké, de a link hoverre színt vált. Hogy az ilyen dolgokat is le kezelje ki kell értékelnie a kifejezést periodikusan, pedig kevésbé terheli a procit ha az onmouseover/out eseményekhez kötöd a színváltást.

A cikk lényege, hogy figyelj oda és gondold át.
7

értem

wiktor · 2007. Nov. 14. (Sze), 21.20
Értem én, hogy mi volt a szerző szándéka. Csak úgy gondolom, hogy nem sikerült elérnie. ;) Illetve felemás érzéseim vannak. Azt gondolom, hogy aki esetleg nem ásta magát mélyebben bele a témába az túl sarkos képet kap.

Kicsit olyan "css expressions are evil" hangulatom volt amikor olvastam. Nem tudom, lehet, hogy én voltam morcos kedvemben délelőtt... :) Ha egy másik példát is mutatott volna, ahol kicsit ellensúlyozza, hogy jó célokra is lehet használni, akkor egy szavam nem lenne... Vagy más lenne a címe...
8

Igen, ez jó kifejezés, ez az "xy is evil"-hangnem

Fraki · 2007. Nov. 15. (Cs), 01.35
Igen, ez jó kifejezés, ez az "xy is evil"-hangnem (meg is említik a kommentekben). Ragyogóan használhatók a szabvány pótlására, én, ha lehet, ajánlom is, ez talán még a legindokoltabb felhasználása. Azzal a megjegyzéssel persze, hogy lehetnek hátulütői (amihez extrém eset vagy nem elég körültekintés kell – pl. position: fixed-re nem használható).

De ha ugyanolyan jól működik tőle az egyébként elavult böngésző, akkor nem különösebben hat meg, hogy minden egérmozdulatra kiértékelődnek (változatlan layout-nál ez valószínűleg aligha számít valamit), mert egyébként egy elegáns módszerről van szó.

Mellesleg amit helyette ajánl, az sem valami menő dolog ("window.onload ="-féle eseménykezelés), mint szintén megemlítik a kommentekben.
9

High Performance Web Sites: Rule 7 – Avoid CSS Expressions

toxin · 2007. Nov. 15. (Cs), 09.46
alatt olvasottak, azért akkor is elgondolkozatóak, gondolok a

Moving the mouse around the page can easily generate more than 10,000 evaluations.

http://developer.yahoo.net/blog/archives/2007/07/high_performanc_6.html

üdv Csaba
10

ez jobb

Fraki · 2007. Nov. 15. (Cs), 13.03
Ez sokkal korrektebb írás! Íme egy hasznos tanács:
One way to reduce the number of times your CSS expression is evaluated is to use one-time expressions

A példája is tetszik, mert az nem szabványpótlás.

A posztbeli cikk igazából nem is tehet mást, mint megtiltja a CSS kifejezéseket, mert épp a szabványpótló funkciót pécézi ki, másra meg úgyse jó, hisz nem keresztplatformos. És emiatt necces is, mert ha másra nem is jó tényleg, pont szabványpótlásra nagyon is az (főleg az idézett jótanáccsal).
2

okoskodás

Fraki · 2007. Nov. 14. (Sze), 16.43
Egyetértek, valaki felfedezte valaminek a lehetséges hátulütőjét, és erre felállította a forradalmi törvényt. Ajax témában emlékszem ilyen szintű "felejtsd el, mert az rossz"-cikkekre.
5

Elévülő téma

Fraki · 2007. Nov. 14. (Sze), 19.44
Valamint több relevanciája lenne a cikkben foglalt problémának, ha nem egy elévülő böngészőről (s így egy szükségképpen elévülő workaroundról) szólna elsősorban a dolog.