Dieser Beitrag ist Teil einer Reihe von Blogbeiträgen, in denen die Änderungen an der Architektur und der Erstellung von DevTools beschrieben werden.
Als DevTools vor vielen Jahren entwickelt wurde, entschied sich das Team, ein benutzerdefiniertes UI-Framework zu erstellen. Das war damals eine vernünftige Entscheidung und hat sich für DevTools bewährt.
Seitdem wurden jedoch verschiedene Funktionen auf der Plattform eingeführt. Eine davon, Web-Komponenten, eignet sich hervorragend zum Erstellen neuer UI-Elemente in DevTools. Durch die Nutzung der Plattform können wir den Umfang des benutzerdefinierten UI-Codes, den wir verwalten müssen, erheblich reduzieren und mehr in die Entwicklung von Funktionen für DevTools investieren, anstatt eine benutzerdefinierte Infrastruktur zu unterstützen.
Zur Unterstützung bei der Umstellung haben wir einen Leitfaden zum Erstellen von UI-Elementen in DevTools erstellt, den wir mit dem gesamten DevTools-Team teilen möchten. Einige Teile des Leitfadens sind speziell auf DevTools und ihre Architektur zugeschnitten, die ihre eigenen Einschränkungen mit sich bringt. Andere Teile sind jedoch allgemeine Richtlinien zu den Ansätzen, die wir beim Erstellen, Strukturieren und Testen von Webkomponenten verwendet haben.
Heute stellen wir dieses Dokument unter goo.gle/building-ui-devtools öffentlich zur Verfügung. Wenn Sie sich schon einmal gefragt haben, wie Webkomponenten in großen, realen Anwendungen verwendet werden oder welche Herausforderungen die Einbindung von Komponenten in eine große, bereits vorhandene Codebasis mit sich bringt, könnte dieses Dokument Ihnen weiterhelfen und einige Antworten liefern. Wenn du Fragen zu unseren Richtlinien hast, kannst du mir gern einen Tweet senden.
Vorschaukanäle herunterladen
Verwenden Sie als Standard-Entwicklungsbrowser Chrome Canary, Chrome Dev oder Chrome Beta. Diese Vorabversionen bieten Zugriff auf die neuesten DevTools-Funktionen, ermöglichen den Test moderner Webplattform-APIs und helfen Ihnen, Probleme auf Ihrer Website zu finden, bevor Ihre Nutzer sie bemerken.
Chrome-Entwicklertools-Team kontaktieren
Mit den folgenden Optionen können Sie über neue Funktionen, Updates oder andere Themen im Zusammenhang mit den DevTools sprechen.
- Senden Sie uns Feedback und Funktionsanfragen unter crbug.com.
- Melden Sie ein DevTools-Problem über das Dreipunkt-Menü Weitere Optionen > Hilfe > DevTools-Problem melden.
- Tweeten Sie an @ChromeDevTools.
- Hinterlassen Sie Kommentare unter den YouTube-Videos zu den Neuigkeiten in den DevTools oder den YouTube-Videos mit Tipps zu den DevTools.