No mám prázdniny (nebo lépe řečeno mám víc práce a méně volného času, než když chodím do školy) a tak se mi nechce moc rozepisovat. Proto jen stručně vysvětlím, co jsem chtěl tím titulkem říci.
Programoval jsem si teď jednu aplikaci v JavaScriptu, kde byla tabulka o 366 buňkách. A já potřeboval udělat drag & drop pro všechny tyto buňky. Proto jsem si vytvořil pole, kam jsem ukládal pozice a rozměry všech buňek, abych je mohl potom porovnávat s pozicí kurzoru myši (při události onmousemove). Kód pro tuto kontrolu vypadal takto:
var poleId = null; for(var i=0; i<rozmery.length; i++){
if(rozmery[i][0] < e.cursorX && rozmery[i][0] + rozmery[i][2] > e.cursorX && rozmery[i][1] < e.cursorY && rozmery[i][1] + rozmery[i][3] > e.cursorY){
poleId = i;
}
}
Kde „rozmery“ je pole s údaji o pozici a rozměrech ([x, y, w, h]) a „e“ je proměnná do které se mi předává událost pohybu kurzoru.
Když jsem tenhle script testoval a podíval se na hodnotu využití CPU prohlížečem, tak jsem tam viděl skok z běžných 25% (slovo „běžných“ má vyjadřovat průměrnou hodnotu, kterou jsem při testování té aplikace bez scriptu výše naměřil), až na 95%.
Jak tedy tuto hodnotu zredukovat?
No je to vcelku jednoduché a jistě to většinu z vás hned napadlo, ale jak jsem se díval na různé webové aplikace, tak to snad nikde není. Stačí přidat kouzelné slovíčko „break“.
var poleId = null; for(var i=0; i<rozmery.length; i++){
if(rozmery[i][0] < e.cursorX && rozmery[i][0] + rozmery[i][2] > e.cursorX && rozmery[i][1] < e.cursorY && rozmery[i][1] + rozmery[i][3] > e.cursorY){
poleId = i;
break;
}
}
Toť je vše. Vytížení CPU se poté odvíjí od toho, kde je zrovna kurzor (v první buňce je nejmenší – u mě 26% a v poslední buňce největší – těch 95%).
A nakonec mě napadlo ještě jedno řešení, které může být ještě lepší, jen záleží na rozložení té tabulky (počet řádku/sloupců). Špatné řešení by totiž nemuselo být nejdříve testovat na kterém řádku tabulky je kurzor a podle toho projít buňky, které tomuto řádku náleží. Sice jsem to nezkoušel, ale určitě by to bylo lepší, než procházet každou buňku.
A nakonec řečnická otázka:
O čem byl celý tenhle článek? No přece o ničem. Objevil jsem asi Ameriku, ale prostě se mi zdálo, že se na to kouzelné slovíčko „break“ nějak zapomíná.
Tags: JavaScript