Firebug – vývojárska extenzia do Firefoxu

Pre webdevelopera je dobré mať po ruke nejaké debuggovacie nástroje, aby mohol rýchlo odstrániť prípadné chyby v kóde bez nutnosti zdĺhavo študovať nejakú chybovú konzolu a podobne. Mozilla Firefox to rieši doplnkom Firebug, ktorý je plnohodnotným debuggovacím softwarom na XHTML, CSS a JavaScript.

Firebug okrem toho, že promptne upozorňuje na chyby v JS kóde, dokáže veľmi jednoducho vizuálne kontrolovať debuggovany kód. Po nabehnutí kurzorom na akýkoľvek objekt na kontrolovanej stránke sa v okne Firebugu zobrazí HTML ekvivalent tohto objektu. Pokiaľ máte v praxi problém s nejakým DIV elementom, stačí na neho nabehnúť kurzorom, okamžite sa zobrazí HTML/CSS zápis tohto DIVu, samozrejme s možnosťou ho hneď editovať a riešiť tak vzniknutý problém.
V prípade editovania CSS kódu je Firebug naozaj výborným pomocníkom, pretože dokáže real-time zobrazovať všetky zmeny, bez nutnosti hore-dolu prepínať z editora na prehliadač. Jedným kliknutím dokáže dokonca deaktivovať (a spätne aktivovať) zvolený riadok z CSS kódu, pričom stránka sa vždy refreshne a zobrazí tak ako by vyzerala s takto upraveným CSSkom. Jednoducho tak môžete odstrániť prípadne duplicity a zbytočnosti, ktoré len zvyšujú objem načítavaných dát.

Zaujímavou funkciou je taktiež zobrazovanie priebehu načítania jednotlivých elementov stránky, pričom pre každý z nich je zobrazený čas potrebný na načítanie (v milisekundách). Môžete si tak veľmi jednoducho zistiť, čo brzdí a spomaľuje stránku, či dokonca, ktoré elementy boli natiahnuté z cache prehliadača a ktoré nanovo načítané zo servra.

Tomáš Mašek