Saubere Trennung vermeidet späteres Chaos
Das ausgeklügeltste Architekturmuster hilft nichts, wenn der Quellcode nicht sauber organisiert ist. Die Trennung von XML und JavaScript in verschiedene Dateien vermeidet von Anfang an Chaos und erleichtert die spätere Wartung. Es empfiehlt sich, die Funktionen und Klassen nach Domäne zu separieren: Für jeden funktionellen Block wird eine eigene Gruppe von Dateien angelegt. Das gilt für alle Ressourcen wie XUL, JavaScript, CSS, Grafiken und Übersetzungen.
Eine Übersicht der Dateien, die im Ordner der q-zilla-Extension zu finden sind, zeigt die folgende Tabelle:
| Datei | Beschreibung |
| chrome.manifest | Identifikation von den Extension-Dateien und deren Funktionen |
| install.rdf | Beschreibung und Versionsinfos |
| content/ | |
| options.js | JavaScript-Logik für das Einstellungsfenster |
| options.xul | Einstellungsfenster |
| overlay.xul | Elemente, die dem Browserfenster zugefügt werden, z. B. Menüeinträge |
| qzilla.js | JavaScript-Logik für das Hauptfenster |
| qzilla.xul | Hauptfenster der Extension |
| locale/en-US | |
| qzilla.dtd | Übersetzungen und Lokalisierung |
| skin/ | |
| qzilla.css | Layouteinstellungen |
Firefox und TYPO3 verbinden
Ähnlich wie AJAX-Anwendungen benutzen Firefox-Erweiterungen den XMLHttpRequest zum Laden externer Daten. Formate wie XML und JSON eignen sich durch ihre einfache Integration in JavaScript besonders gut zur Übertragung. Stehen die Daten bereits als RSS-Feed zur Verfügung, wie zum Beispiel für die TYPO3-Nachrichtenverwaltung (tt_news), ist serverseitig keine weitere Modifikation nötig. Im Code selbst werden die XML-Daten der Erweiterung als DOM-kompatibler Dokumentbaum abgerufen, der wie das „document“-Element in Webseiten aufgebaut ist.
Listing 1 zeigt das Auslesen eines RSS-Feed mit dem DOM-Baum eines XMLHttpRequest:
