Polymer und Web Components sind in letzter Zeit sehr beliebte Themen. Da sich dieses Ökosystem schnell weiterentwickelt, ist es für Entwickler oft schwierig, über alle aktuellen Änderungen auf dem Laufenden zu bleiben.
In seinem Vortrag auf dem Chrome Dev Summit erklärte Matt McNulty, Engineering Manager für das Polymer-Team, was Polymer ist und stellte auch die Roadmap für Polymer 1.0 vor.
Was ist Polymer?
Was genau ist Polymer?
Polymer ist eine Bibliothek, mit der Sie Elemente und Apps aus Webkomponenten erstellen können. Webkomponenten sind eine Reihe neuer Standards, mit denen Entwickler den HTML-Wortschatz um eigene benutzerdefinierte Elemente erweitern können.
Da Webkomponenten als neues Grundelement für den Browser konzipiert sind, sind sie sehr leistungsstark, aber auch sehr niedrig und erfordern viel Code.
Polymer erleichtert die Arbeit mit Webkomponenten durch eine vereinfachte Syntax. Dadurch wird die Menge an Boilerplate-Code reduziert, die Sie schreiben müssen, und es wird ein deklarativer Stil hinzugefügt, sodass das Erstellen von Webkomponenten so einfach ist wie das Schreiben von HTML.
Das Polymer-Experiment
Polymer begann als Experiment, um zu sehen, ob wir die Web Component-Standards polyfillen und Feedback von Entwicklern erhalten konnten, bevor diese Technologien in allen Browsern verfügbar waren. Als immer mehr Entwickler Polymer verwendeten, entwickelte es sich von reinen Polyfills zu einer echten Bibliothek mit vielen Produktivitätsfunktionen (Datenbindung, Überwachung von Attributänderungen, automatisches Suchen von Knoten usw.). Alle Tests liefern Ergebnisse. Wie haben wir also abgeschnitten?
Viele Entwickler gaben an, dass sie die Ausdrucksstärke und die Produktivitätssteigerung bei der Arbeit mit Webkomponenten in Polymer schätzten, äußerten aber auch Bedenken hinsichtlich der Leistung und der allgemeinen Komplexität.
Es wird eine natürliche Spannung deutlich, die Polymer schon immer hatte: Es soll ein Experiment sein, um die Webplattform voranzutreiben, aber auch etwas Produktionsreifes schaffen, auf das sich Entwickler verlassen können.
Anstehende Änderungen
Das Polymer-Team hat sich jede Funktion der Bibliothek genau angesehen, um eine schlankere, produktionsreife Version zu entwickeln, die Entwickler bedenkenlos verwenden können.
Ebenen
Polymer wurde in eine Reihe von Ebenen umgestaltet. Die Kernfunktionen sind schnell und schlank, während die erweiterten Funktionen optional sind. In den meisten Anwendungsfällen sollten die Kernfunktionen die Anforderungen von Entwicklern abdecken.
Vereinfachte Datenbindung
Das Datenbindungssystem von Polymer wurde ebenfalls erheblich optimiert. Gemäß dem mehrschichtigen Ansatz ist die bidirektionale Datenbindung jetzt optional. Standardmäßig wird die unidirektionale Datenbindung verwendet. Außerdem wurden veröffentlichte Attributtypen explizit gemacht und eine Attributänderung löst jetzt ein Ereignis aus, damit Elemente aus verschiedenen Bibliotheken einfacher kommunizieren können.
Schlankeres Shadow-DOM
Das Shadow-DOM-Polyfill ist eine erstaunliche technische Leistung. Es wurde umfassend und spezifikationskonform entwickelt, was für das gründliche Testen des Plattformprimitivs wichtig ist, führt aber leider zu einer Reihe von Leistungsengpässen für Funktionen, die von Polymer nicht verwendet werden.
In der nächsten Version von Polymer wird ein anderer Ansatz verfolgt. Es wird eine Shim-ähnliche Ebene verwendet, die nur die Polyfills enthält, die für Polymer erforderlich sind.
Das vorhandene Polyfill wird für generische Webkomponenten, die nicht auf Polymer basieren, weiterhin verwendet.
Umstellung auf webcomponents.org
Apropos Polyfills: Auch diese ziehen um. Derzeit sind viele Entwickler verwirrt über die Beziehung zwischen Polymer und Web Components. Einige denken, dass man Polymer vollständig verwenden muss, um Webkomponenten zu nutzen. Tatsächlich sind aber nur die Polyfills erforderlich.
Um diese Unterscheidung deutlicher zu machen, werden die Polyfills zu webcomponents.org verschoben und in webcomponents.js umbenannt.
Diese Änderung soll anderen Bibliotheksautoren helfen, die Polyfills ohne Verwirrung zu nutzen. Das Polymer-Team wird weiterhin zu den Polyfills beitragen. Wir hoffen jedoch, dass diese Änderung sie zu einer gemeinsamen Ressource für die Community macht.
Ergebnisse
Was sind die Ergebnisse dieser Änderungen?
Geschwindigkeit
In Chrome ist Polymer jetzt fünfmal schneller und in Safari hat sich die Geschwindigkeit verachtfacht.
Dateigröße
Die Dateigröße wurde um 87 % reduziert, von 123 KB auf 15 KB (6 KB komprimiert).
Roadmap
Im nächsten Release wird es einige API-Änderungen geben, die nicht abwärtskompatibel sind. Dies wird durch die neue Versionsnummer (0.8) angezeigt. Das Team möchte jedoch klarstellen, dass es sich nicht um eine Neufassung handelt. Die Migration Ihres aktuellen Projekts von Polymer 0.5 zu 0.8 sollte relativ einfach sein.
Das Polymer-Team hat außerdem eine Roadmap erstellt, um Entwicklern mehr Klarheit über anstehende Releases zu geben.
Die Version 0.8 ist jetzt als Branch auf GitHub verfügbar. Sie wird jedoch noch sehr aktiv weiterentwickelt und es gibt noch keine Dokumentation. Die offizielle Betaversion 0.9 ist für das 1. Quartal 2015 geplant, Version 1.0 für das 2. Quartal.
Der Test ist beendet
Mit den jüngsten Änderungen an Polymer legt das Team dahinter den Grundstein dafür, dass Web Components ein integraler Bestandteil des Stacks jedes Entwicklers werden. Wenn Sie noch keine Erfahrung mit Web Components haben, sollten Sie sich jetzt mit diesen bahnbrechenden Technologien vertraut machen. Wenn Sie bereits mit Komponenten (und Polymer) arbeiten, sieht die Zukunft wirklich rosig aus. Im Polymer-Blog finden Sie alle aktuellen Updates. Wenn Sie Fragen oder Anmerkungen haben, können Sie sich in die Polymer-Mailingliste eintragen. Viel Spaß beim Hacken!