Es gibt eine riesige Menge an Funktionen im Web. Das Browser Compatibility Data-Projekt listet mehr als 14.000 davon auf! Wie kann man das alles verstehen?

Dies ist eine Frage, die seit langem unbeantwortet bleibt. Ja, jeder Webentwickler nutzt caiuse.com. Oder sie googeln oder fragen vielleicht chatgpt. Das Problem besteht darin, dass diese Tools Antworten auf spezifische Fragen bieten, ihnen aber ein Gesamtbild oder Links zur Quelle der Wahrheit fehlen.

Die WebDX-Gruppe

Nicht mehr! Die WebDX-Gruppe leistet jetzt unglaubliche Arbeit beim Organisieren, Kategorisieren und Benennen von Dingen (← das ist der schwierige Teil, wie Sie wissen) rund um die Webplattform. Sie versuchen, das gesamte Entwicklererlebnis mit dem Web und den Browsern auf koordinierte Weise zu verbessern.

WebDX ist eine Community-Gruppe, die Teil des W3C ist. Sie können in ihren Repositories sehen, was sie kochen. Die interessanteste Ausgabe für mich ist das Web-Features-Repo. Was sie getan haben, ist, eine große Menge spezifischer Funktionen in einen verständlicheren Satz übergeordneter Funktionen zu kategorisieren.

Eine der neu verfügbaren Funktionen ist beispielsweise Methoden festlegen. Jede neue Methode zur Manipulation einer Menge könnte ein einzelnes Feature sein. Es wird jedoch viel nützlicher, wenn es als einzelnes High-Level-Feature kommuniziert und dokumentiert wird.

Die Dokumentation

Der andere Teil besteht darin, detaillierte Informationen zu einer Funktion zu finden. Nun, hier kam die Open Web Docs-Initiative ins Spiel. Während MDN schon immer eine gute Referenz war, mangelte es an praktischen Inhalten. Die Open Web Docs-Gruppe versucht das zu ändern. Sie bringen eine Menge neuer Tutorials, Leitfäden und Erklärungen für die MDN-Webdokumentation sowie Aktualisierungen der zugrunde liegenden Daten heraus – BCD (Browser Compat Data).

Ein Beispiel ist eine Seite auf MDN über relative Farben. Es ist sauber einer High-Level-Webfunktion zugeordnet. Es bietet ein viel besseres Verständnis und einen besseren Kontext zu dieser Funktion als die einzelnen Referenzseiten für jede Farbfunktion.

Die Umfragen

Das wirklich Schöne an der oben genannten Initiative ist, dass sie wirklich zusammenarbeiten wollen. Sie nehmen Eingaben aus Umfragen wie „The State of HTML“ und „The State of CSS“ entgegen und können später dieselben Namen für Webfunktionen verwenden, um Umfrageergebnisse zu ihnen zu verfolgen.

Und übrigens können Sie beim Ausfüllen dieser Umfragen auf die Schaltfläche „Zur Leseliste hinzufügen“ klicken. Es werden Ihnen Links zu MDN angezeigt, wo Sie mehr über genau die Dinge erfahren können, die Sie noch nicht wussten.

Die Realität

Großartig, aber wird das Web besser? Verdammt, ja, das ist es!

Die Initiative, die Lücke zwischen gewünschten Funktionen und tatsächlicher Verfügbarkeit in allen Browsern zu schließen, ist offensichtlich. Das Interop-Projekt stellt nämlich sicher, dass eine Reihe von Funktionen in allen gängigen Browsern möglichst vollständig implementiert sind. Jedes Jahr gibt es eine neue Iteration dieses Projekts.

Wie viel und wie gut diese Funktionen implementiert sind, wird mithilfe von Webplattformtests gemessen. Die gleichen Tests werden für alle Browser ausgeführt. Deshalb haben wir diese schönen Prozentsätze, die den tatsächlichen Zustand der Funktionen in den Browsern widerspiegeln.

Die Grundlinie

Der Moment, in dem eine Funktion in allen gängigen Browsern implementiert wird, ist ein sehr wichtiger Moment. Und da wir die Features wie oben beschrieben schön gruppiert haben, fehlt vorerst nur noch ein Name. Und da haben wir es: Eine Funktion ist Baseline New verfügbar, wenn sie von allen gängigen Browsern unterstützt wird. Und eine Funktion ist allgemein verfügbar, wenn seit ihrer neuen Verfügbarkeit zweieinhalb Jahre vergangen sind.

Sie können mehr über die Baseline-Idee auf web.dev lesen, seit sie von Google initiiert wurde.

Die visuellen Dashboards

Alles ergibt mehr Sinn, wenn man es visueller sehen kann. Gut gestaltete Tabellen, Grafiken, praktische Links zu Ressourcen direkt vor Ort …

Dies ist Teil einiger Versuche, nützliche Dashboards zu erstellen. Schauen Sie sich alle an, jede davon ist eine andere Sicht auf das Thema:

• Einfaches Dashboard von den Leuten hinter der WebDX-Gruppe
• Schöne Diagramme zum Bestehen von Webplattformtests Feature für Feature vom Google Chrome-Team
• und mein Versuch, eine interaktivere Version zu erstellen

Sie können sie von Zeit zu Zeit nutzen, um sich darüber zu informieren, was es Neues im Allgemeinen oder was Neues im Status „Wide Adoption“ gibt. Es ist auch eine gute Referenz, wenn Sie ein neues Projekt starten und entscheiden, welche Funktionen tatsächlich verfügbar sind und ausreichend unterstützt werden.

Web Features Explorer zeigt die Informationen auf saubere Weise an

Webstatus.dev zeigt echte Fortschritte bei den Funktionen in Bezug auf bestandene Webplattformtests in Diagrammen

Das Dashboard „My Web Platform Features“ ermöglicht Filter- und Sortierfunktionen

Die Zukunft

Einige Funktionen wurden in letzter Zeit ziemlich schnell in allen Browsern implementiert. Einige Browser-Hersteller halten einige jedoch möglicherweise nicht einmal für eine gute Idee. Detaillierte Informationen darüber, was möglicherweise kommt und was nicht, finden Sie auf den folgenden Websites:

• Mozilla-Standardpositionen
• Standardpositionen des Webkit-Teams
• Google Chrome-Funktions-Roadmap

Abschluss

Es ist faszinierend zu beobachten, wie sich die Webplattform weiterentwickelt. Die Feedbackschleife verbessert sich. Die Interoperabilität wird in vielen Bereichen besser.

Ich wollte schon lange ein nützliches Dashboard mit Webfunktionen haben, und plötzlich sind die Daten von so guter Qualität, dass ich es geschafft habe, in ein paar Abenden mein eigenes zu erstellen.