Categories: BrowserWorkspace

Mozilla stellt kostenloses Entwickler-Tool Debugger.html vor

Mit Debugger.html stellt die Mozilla-Foundation ein neues Developer-Tool für den eigenen Browser aber auch für Web-Anwendungen vor. Debugger.html ist ein vollständig neu aufgesetztes Projekt und basiert auf den React- und Redux-Web-Architekturen. Gleichzeitig führt Mozialla auch ein neues Management für das Tool ein. Das Tool wird zusammen mit Firefox ausgeliefert und kann so schnell von Entwicklern verwendet werden. Debugger.html ist ab heute in der Firefox-Nightly-Version der DevTools enthalten.

Generell stelle Mozilla sämtliche Developer-Tools die aus dem DevTool-Team kommen von der XUL-Architektur auf die wiederverwendbaren React-Komponenten und Redux-Speicher-Modelle um. Das hat den Vorteil, dass der Code in kleinere Module gepackt wird und sich so deutlich verschlanken lässt. Dadurch, so verspricht Mozilla, werde auch der Umgang mit diesen Tools deutlich einfacher und auch die Anpassung des Tools soll so beschleunigt werden.

Debugger.html ist ein neues Entwickler-Tool für Firefox, das aber aufgrund neuer Web-Technologien künftig auch mit Chrome verwendet werden kann. (Bild: Mozilla Foundation)

Mozilla zielt mit dem neuen Tool vor allem auf den eigenen Firefox-Browser. Künftig aber soll das Tool auch für andere Browser verfügbar werden. Konkret nennt das Team das Chrome Debugging Protocol für Chrome-Tabs sowie Node-Prozesse. Auch diese Offenheit werde durch die Verwendung der neuen Architektur möglich. Allerdings seien diese Komponenten noch nicht für den produktiven Einsatz geeignet.

Ein Team bei Mozilla arbeite kontinuierlich daran, ältere Tools umzuschreiben. Bei Debugger.html jedoch hätten die Entwickler von Grund auf die neuen Web-Technologien genutzt. Auch befinde sind der Debugger noch in einer frühen Phase. Auf Github könnten Interessierte aber selbst an dem Code arbeiten und das Tool weiterentwickeln.

Das “Source”-Panel (Bild: Mozilla Foundation)

Neue Wege geht das Mozilla-Team auch bei der Nutzerschnittstelle des Tools, das jetzt in die drei Segmente Source Panel, Editor Panel und die Right Sidebar aufgeteilt ist, wie in einem Blog erklärt wird. Im Source-Teil wird ein Baum des Codes für die aktuelle Anwendung dargestellt. Im Bereich Editor werden verschiedene Dateien angezeigt. Auch Breakpoints lassen sich hier setzen. Die Right Sidebar zeigt dann die Breakpoints, den Call Stack und Scoped Variables an, wenn der Debugger pausiert.

Die Right Sidebar im Debugger.html
Redaktion

Recent Posts

Kubernetes in Cloud-Umgebungen

Ein elementarer Bestandteil einer effektiven Cloud-Strategie ist nach erfolgter Implementierung die künftige Verwaltung des Dienstes.

19 Stunden ago

Aras erweitert seine PLM-Plattform

Die Neuerungen sollen den Digital Thread, die Low-Code-Entwicklung, die Visualisierung komplexer Baugruppen und das Lieferantenmanagement…

21 Stunden ago

Manufacturing-X: Zurückhaltung überwiegt

Eine Bitkom-Umfrage attestiert der Datenraum-Initiative des Bundes hohe Bekanntheit in der Industrie. Doch noch ist…

21 Stunden ago

Ransomware „Marke Eigenbau“

Ransomware-as-a-Service ist ein lukratives Geschäft und in den Händen professionell organisierter Gruppen. Jetzt können Kriminelle…

2 Tagen ago

Bad Bots: Risikofaktor mit hohen Folgekosten

Bad Bots richten nicht nur wirtschaftlichen Schaden an. Laut dem Bad Bot Report von Imperva…

3 Tagen ago

IT-Verantwortliche setzen auf KI-Hosting in Europa

Studie von OVHcloud verdeutlicht Stellenwert von Datenresidenz und Datensouveränität bei KI-Anwendungen.

4 Tagen ago