Přejít k navigační liště

Zdroják » JavaScript » Jan Odvárko: na Firebugu je radost pracovat

Jan Odvárko: na Firebugu je radost pracovat

Jan Odvárko se věnuje vývoji známého nástroje Firebug určeného pro webové vývojáře. Zeptali jsme se ho, jak se k této práci dostal a jakým způsobem spolupráce uvnitř Firebug týmu probíhá. Pokusíme se i trochu poodhalit, jaká je budoucnost Firebugu a na co se můžeme v nejbližší době těšit.

Ahoj Honzo, poslední dobou se podílíš na vývoji Firebugu. Kolik lidí na něm pracuje a co přesně máš na starosti ty?

V základním Firebug týmu je nás v současné době pět: John J. Barton (IBM), Rob Campbell (Mozilla), John Resig (Mozilla), Steve Souders (Google) a já (Mozilla). Nicméně vývoje se účastní celá řada dalších lidí. Jsou to především ti, kteří jsou členy FWG (Firebug Working Group) a také velké množství komunitních přispěvovatelů, bez kterých bychom se určitě neobešli.

Já osobně jsem věnoval hodně energie práci na Net panelu zobrazujícím časový přehled informací o nahrávání webové stránky. V poslední době také pracuji na nových Firebug APIs, které zlepšují jeho extensibilitu a tvorbu rozšíření pro Firebug. Dále mám na starosti organizaci lokalizací do různých jazyků a samozřejmě opravu chyb, které pocházejí z různých oblastí Firebugu.

Jan Odvárko se s platformou Mozilla prvně setkal ve startupu AllPeers. Nyní žije v Českých Budějovicích a využívá svých zkušeností při práci na projektu Firebug, který je vyvíjen pod křídly Mozilla Corporation.

Na svém blogu Software is hard se Jan věnuje zejména Firebugu, mj. publikuje návody, jak mohou vývojáři pomocí rozšíření přidávat do Firebugu další funkce stejným způsobem, jakým je rozšiřován i samotný prohlížeč Firefox.

Pokud vím, pracuješ na vývoji Firebugu fulltime, ale žiješ tady v Čechách. Je snadné od nás pracovat pro Mozilla Corporation sídlící v Mountain View? Znáš se osobně s jejími zaměstnanci?

Práce na Firebugu, což zahrnuje také vývoj rozšíření pro Firebug, především Fireunit a Firecookie, zabírá prakticky veškerou mou pracovní energii. Pracuji tady v Čechách, ale nejsem v tomto ohledu výjimkou, protože celý Firebug tým je distribuovaný po světě. Myslím, že tento styl práce vyžaduje především dobré (e)komunikační schopnosti. Je nutné efektivně využívat dostupné elektronické kanály, nejčastěji newsgroups, IRC, blog, email a také starý dobrý telefon. Dobré je, že infrastruktura pro distribuované týmy je v Mozille dobře propracovaná. Největší problém, který mě teď napadá, jsou snad jen rozdílná časová pásma.

Měl jsem řadu příležitostí účastnit se konferencí, které Mozilla pořádala, nebo se jich účastnila, a osobně jsem se seznámil s mnoha lidmi, kteří pro Mozillu přímo pracují. Nicméně i v době moderních komunikačních technologií jsou tyto události a možnost setkat se osobně s lidmi, s kterými jsem v každodenním e-kontaktu, velmi užitečné. Byl jsem docela nadšený, když jsme se jako Firebug tým na summitu ve Vancouveru konečně všichni sešli.

Jan Odvárko

Jak si se k téhle práci dostal? Dělal jsi přijímací pohovor? Jak probíhal?

Už v AllPeers jsme úzce spolupracovali s Mozillou. Naším produktem bylo rozšíření pro Firefox, takže taková spolupráce byla důležitá. Pokud stavíte produkt založený na open source, je přínosné být členem komunity a získávat kontakty na vývojáře, kteří znají odpovědi na otázky. Přijímací pohovor jsem dělat nemusel, moje zkušenosti byly dostatečným osvědčením.

Pracovat na platformě Mozilla vyžaduje znalost řady technologií, někdy specifických přímo pro Mozillu a ne vždy plně zdokumentovaných. Co bylo pro tebe největší překážkou?

Neuvědomuji si právě žádnou zásadní překážku, kterou bych musel řešit. Samozřejmě nedostatek dokumentace představuje vždy bariéru, ale v tomto směru je MDC (Mozilla Development Center) a také online podpora na IRC a newsgroups velkou oporou.

Proč myslíš, že se Firebug stal u vývojářů tak oblíbený?

Převážná většina příspěvků, které dostáváme od komunity kolem Firebugu, začíná nějak takto: „The best tool ever“, „I can’t imagine my life without it.“, „Must have…“, „Finally I understood JavaScript, HTML, CSS“. Tak najdou se také negativní příspěvky, ale přesto je opravdu radost pracovat na takovém projektu.

Právě ten poslední z jmenovaných příspěvků snad vyjadřuje právě to, co vývojáři na Firebugu opravdu oceňují. V jednoduchosti je síla a uživatelské rozhraní Firebugu je jednoduché a rychle při ruce. Nezabírá celou obrazovku a není nutné číst dokumentaci při prvním použití. Okamžitě je vidět, jak vypadá zdrojové HTML nebo odpovídající CSS pro daný element. Je jednoduché umístit breakpoint a vidět případné javascriptové chyby na stránce. Řadu dalších a doplňujících funkcí pak uživatel postupně objevuje tím, jakFirebug více a více používá. Takový přístup je myslím zároveň Alfa a Omega každého přívětivého uživatelského rozhraní a také základ úspěchu nástroje, jako je právě Firebug.

Firebug

Firebug se prakticky stal průmyslovým standardem a dnes všechny významné prohlížeče mají jeho vlastní obdobu. Jak s nimi chcete soupeřit? Chystáte větší změny nebo půjdete cestou drobných vylepšení?

Ve výčtu nových funkcí, které bychom rádi ve Firebugu měli, jsme limitováni tím, co umí samotný Firefox. Například nový Memory panel je velmi žádaný, ale bohužel ještě neexistují odpovídající API, které by nám umožnily informace o použití paměti pro danou stránkou nějak prezentovat uživateli. V každém případě ale chystáme řadu dalších nových funkcí. Například podporu pro JSON a další standardní formáty, podporu pro unit-testing, rozmanitější API pro Firebug rozšíření, debugování událostí, export dat například z Net panelu a JavaScript profileru, možnost uložení CSS a HTML změn provedených přímo na stránce. Rád bych také více prozkoumal možnosti těsnější integrace s některými existujícími IDE například NetBeans nebo Aptana.

Nedokážu odhadnout, zda jsou to větší či menší změny, ale jsem si jistý, že správná implementace a integrace všech připravovaných funkcí do uživatelského rozhraní bude dalším důvodem, proč vybrat právě Firebug.

Pokud by tenhle rozhovor četl člověk, který by se rád zapojil do vývoje Firebugu, čím by měl začít? A co všechno musí umět?

Záleží na konkrétní roli, kterou by takový člověk chtěl zaujmout. Pokud se jedná o vývojáře, který chce přispívat do Firebug code base, musí jednoznačně znát JavaScript, XUL a Mozilla API. Jako tým ale nepotřebujeme pouze patche. Polovinu času při opravě nějakého problému často zabere jeho reprodukce. Už jen mít spolehlivý test-case, který ukazuje chybu, je velmi přínosné. Právě taková pomoc je myslím lepším začátkem než snaha okamžitě vyvářet patch bez znalosti kódu a souvislostí.

Nejlepšími zdroji informací o Firebug API je pak Firebug Newsgroup, nově zprovozněný Firebug blog, a také můj blog, kde jsem v sérii článků popsal, jak Firebug pracuje interně a jak psát nová rozšíření.

Jan Odvárko při prezentaci

Jako součást Firebugu vznikla i zajímavá knihovna Domplate, kterou se chystáte uvolnit jako samostatný projekt. Co je Domplate a k čemu slouží?

Domplate je modul zodpovědný za generování prakticky celého uživatelského rozhraní Firebugu. Z mnoha projektů jsem nasbíral velké zkušenosti s návrhem a vývojem UI a přístup, který Domplate používá pro generování HTML, je opravdu dobře propracovaný. Elegantně navržený objektově orientovaný způsob umožňuje definici UI šablon a jejich opětovné znovuvyužití. Domplate je velmi flexibilní a jeho výhody jsou zřejmé především při generování složitějšího UI.

Důležité je, že Domplate může být také samostatně použitý pro generování dynamických HTML stránek na straně klienta. Celý modul je složený z jednoho javascriptového souboru, který v nekomprimované verzi zabírá necelých 30 kB. Myslím, že právě Firebug je zde tím příkladem, který ukazuje, že generované rozhraní může být opravdu dynamické. Domplate byl původně napsán pouze pro Firefox, dobrou zprávou je, že patch, který umožňuje použití Domplate ve všech hlavních prohlížečích, už je také na světě.

Nedávno jsi se podílel na (nakonec neúspěšném) startupu AllPeers. Co ti ta práce dala? V čem spočívá riziko neúspěchu takového projektu?

Přestože jsme s AllPeers nedosáhli takového úspěchu, jaký jsme si představovali, byla to velká zkušenost. Budovat start-up od samého počátku přináší celou řadu příležitostí pro pochopení procesů, které s vybudováním takové firmy souvisí. Je třeba udělat celou řadu rozhodnutí, která zejména na začátku, mohou mít velký dopad. Viděno z dnešního pohledu, je jasné, že jsme byli příliš konzervativní, co se týče výše získaných investic a zároveň ambiciózní v množství práce, která s naším produktem souvisela. S výší ambic pak pochopitelně roste i riziko neúspěchu. Nicméně jsem si docela jistý, že sestavit tým složený z odborníků v dané oblasti a také z lidí, kteří se umí společně soustředit na konkrétní úkol, se nám opravdu podařilo. Právě práce na budování týmu a zavedení interních procesů byla pro mě jedna z těch nejzajímavějších zkušeností.

Jak AllPeers, tak Firebug jsou open source. Je open source lepší něž jiné varianty nebo na tom vůbec nezáleží?

Nedá se jednoduše říci, co je lepší, záleží na konkrétním projektu. Open source přístup nelze prostě aplikovat automaticky s představou, že to přinese pouze výhody. Pro komerční společnost, která vidí svůj zdrojový kód jako jedno z hlavních know-how, není open source pravděpodobně ta správná cesta. Na druhou stranu některé projekty mohou zveřejněním zdrojového opravdu více získat využitím vývojářské komunity než ztratit na poli konkurenčních výhod. Firebug je v tomto směru typickým open source produktem. Také proto, že je určený pro vývojáře. Nutno dodat, že komunita kolem Firebugu je velmi kvalitní a moje práce je z velké části řízena práve touto komunitou.

Děkuji za rozhovor a přeji, ať se tobě i Firebugu daří.

Otázky za Zdroják kladl Martin Hassman, odpovídal Jan Odvárko. Fotografie poskytl Jan Odvárko.

Používáte Firebug?

Komentáře

Subscribe
Upozornit na
guest
17 Komentářů
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
View all comments
David Kolibáč

Je nutné efektivně využívat dostupné elektronické kanály, nejčastěji…

echy

Jako tým, ale nepotřebujeme pouze patche.

Tady ta čárka je zase navíc.

LesTR

Díky za zajímavý rozhovor. Firebug používám dnes a denně a je to opravdu skvělý nástroj

eee

Kdyby někoho zajímal námět na vylepšení, tak mě s firebugem trápívá jedna věc. A to vidím html kód v kterém je handler, třeba na onclick. Rád bych na něj dal breakpoint, ale v html kódu to nejde a najít umístění toho handleru je občas děsná dřina. Tak kdyby to šlo nějak zjednodušit. Děkuji.

Jan.Odvarko

V tomto by mohl pomoci nový "break on next" feature, který je součástí FB 1.4. Tato funkce umožňuje aktivovat debugger při nebližší příležitosti. Pro debugování onClick by použití vypadalo nějak následovně:

1) nahraj stránku
2) klikni na "break on next"
3) proveď akci, která generuje patřičnou událost
4) debugger je aktivován na první řádce JS, který se spustí

http://code.google.com/p/fbug/issues/detail?id=177

(snad zase nechybí nebo nepřebývá nějaká čárka ;-)

Honza

Yaroukh

0) handlery v kódu jsou prasárna

naked

oh, jak objevne a prakticke. Mas jeste vic podobnych? (nebo uz te to za dva roky preslo?)

Yaroukh

Nepřijdou Vám "trochu" prohozené ty dva hlavní menu-bary ve Firebugu? Přepínat spodním menu-barem obsah toho horního…?

Můj dotaz je samozřejmě rázu řečnického… Nevěřím, že pro tuhle nelogičnost existuje rozumné zdůvodnění; a (znovu) bych se tímto rád přimluvil za to, aby někdo ty dva řádky v kódu Firebugu prohodil.

Jan.Odvarko

Ano to je pravda. I když upřímně řečeno, mně to moc nevadí (snad síla zvyku). V každém případě jsme s tím dělali nějaké pokusy. Podívejte se sem (+screenshots): http://curtisb.posterous.com/firebug-ui-tabs-on-the-top)

Issue 222: better arrangement of Firebug layout
http://code.google.com/p/fbug/issues/detail?id=222

Honza

Yaroukh

Díky za odpověď. Jsem rád, že je snad nějaká šance…

Přeji hodně zdaru

P.S.: Jo, taky mi to nerve žíly, jde mi spíš o princip a pořádek. :)

trapet

Firebug je velmi uzitecny nastroj. Chybi mi v nem ale napr. moznost hledani.

Petr

Jan.Odvarko

Předpokládám, že search-box (na pravé straně toolbaru) pro vyhledání textu v aktuálním panelu jste již vyzkoušel. Funguje to podobně jako Find bar (Ctrl+F) pro Firefox.

Ovšem velmi chybí možnost vyhledávání ve všech JS souborech najednou (vysoko na našem dlouhém seznamu přání). Tohle jste měl na mysli?

Více:
Search across all Javascript sources, not just one.
http://code.google.com/p/fbug/issues/detail?id=1184

Net/Console panel search over XHR request/response contents
http://code.google.com/p/fbug/issues/detail?id=224

Honza

karmi

Chci jen pridat dalsi „ultra-pozitivni“ ohlas navic! Dekuji za vasi praci (+ zbytku tymu) na Firebugu: Firebug je podminka sine qua non pro vyvijeni Ajaxove interaktivity. Neumim si predstavit, ze bych ladil Ajax requesty jinak (curl, anyone? :).

Diky!!,

–karmi

Anonymní

Jen bych chtel poznamenat, ze AllPeers ma otecrenou pouze klientskou cast. Server je uzavreny. Tak to jen tak pro presnost.

Keff

Rád bych panu Odvárkovi i zbytku týmu poděkoval za výborný nástroj, a jelikož se tu pan Odvárko pohybuje, rád bych se ho zeptal:

Napadlo vás někdy udělat z Firebugu editor css? Anebo alespoň umožnit ukládání editovaného CSS do souboru? Trávím hodně času laděním stylů ve Firebugu a pak překopírováváním upravených kousků zpátky do editoru, kdybych mohl např. do css komentáře přidat cestu, a Firebug pak po Ctrl+S uložil aktuální css soubor(y) pod jejich původním názvem do dané cesty, nepotřeboval bych editor a stačil by mi Firebug :).

Jan.Odvarko

Náš plán je nedělat z Firebugu editor. Od toho je tady celá řada existujících IDE, které můžeme s Firebugem případně integrovat. Nicméně souhlasím, že uložit změny editovaného CSS/HTML by bylo opravdu velmi užitečné. Tohle je mimochodem v současné době ta nejžádanějsí a prozatím nepodporovaná funkce, která má pro nás velkou prioritu.

http://code.google.com/p/fbug/issues/detail?id=9
http://code.google.com/p/fbug/issues/detail?id=179

Honza

Keff

Děkuji moc za odpověď a odkazy, sám jsem issues nenašel :).
Držím palce ať vám jde vývoj od ruky!

Enum a statická analýza kódu

Mám jednu univerzální radu pro začínající programátorty. V učení sice neexistují rychlé zkratky, ovšem tuhle radu můžete snadno začít používat a zrychlit tak tempo učení. Tou tajemnou ingrediencí je statická analýza kódu. Ukážeme si to na příkladu enum.

Pocta C64

Za prvopočátek své programátorské kariéry vděčím počítači Commodore 64. Tehdy jsem genialitu návrhu nemohl docenit. Dnes dokážu lehce nahlédnout pod pokličku. Chtěl bych se o to s vámi podělit a vzdát mu hold.