Polymeer- en webcomponenten zijn de laatste tijd zeer populaire onderwerpen, en aangezien dit ecosysteem snel evolueert, kan het voor ontwikkelaars vaak moeilijk zijn om op de hoogte te blijven van de nieuwste veranderingen.
In zijn lezing op de Chrome Dev Summit legde Matt McNulty, technisch manager van het Polymer-team, uit wat Polymer is, en schetste hij ook de routekaart naar Polymer 1.0.
Wat is polymeer?
Ten eerste: wat is Polymeer precies?
Polymer is een bibliotheek waarmee u elementen en apps kunt bouwen uit webcomponenten. Webcomponenten zijn een geavanceerde set nieuwe standaarden waarmee ontwikkelaars de HTML-vocabulaire kunnen uitbreiden met hun eigen aangepaste elementen.
Omdat Web Components zijn ontworpen als een nieuwe primitief voor de browser, betekent dit dat ze zeer krachtig zijn, maar ook een zeer laag niveau hebben en dat het werken ermee behoorlijk wat code vereist.
Polymeer maakt het gemakkelijker om met webcomponenten te werken door de syntaxis te "suikeren". Het vermindert de hoeveelheid standaardcode die u moet schrijven en voegt een declaratieve stijl toe, zodat het maken van webcomponenten net zo eenvoudig is als het schrijven van HTML.
Het polymeerexperiment
Polymer begon als een experiment om te zien of we de Web Component-standaarden konden polyfillen en feedback van ontwikkelaars konden krijgen voordat deze technologieën in alle browsers beschikbaar waren. Naarmate meer ontwikkelaars Polymer begonnen te gebruiken, veranderde het van alleen maar polyfills naar een echte bibliotheek vol productiviteitsfuncties (databinding, watchers voor attribuutwijzigingen, automatisch zoeken naar knooppunten, enz.). Maar alle experimenten hebben resultaten, dus hoe hebben we het gedaan?
Hoewel veel ontwikkelaars zeiden dat ze de expressiviteit en productiviteitswinst van het werken met Web Components in Polymer leuk vonden, uitten ze ook hun zorgen over de prestaties en de algehele complexiteit.
Het benadrukt een natuurlijke spanning die Polymer altijd al heeft gehad: wees een experiment om het webplatform vooruit te helpen, maar creëer ook iets productiewaardigs waar ontwikkelaars op kunnen vertrouwen.
Aankomende veranderingen
Het Polymer-team heeft elke functie van de bibliotheek grondig bekeken met als doel een slankere, productieklare versie uit te werken die ontwikkelaars met vertrouwen kunnen gebruiken.
Lagen
Polymeer is opnieuw verwerkt in een reeks lagen. De kernfuncties zijn snel en gestroomlijnd, terwijl de meer geavanceerde functies opt-in zijn. Voor de meeste gebruiksscenario's moeten de kernfuncties de behoeften van ontwikkelaars dekken.
Vereenvoudigde gegevensbinding
Het databindingssysteem van Polymer is ook aanzienlijk geoptimaliseerd voor prestaties. Door de gelaagde aanpak te volgen, is tweerichtingsbinding nu opt-in, waarbij de standaard eenrichtingsbinding is. Bovendien zijn gepubliceerde eigenschapstypen expliciet gemaakt en activeert een eigenschapswijziging nu een gebeurtenis om elementen uit verschillende bibliotheken gemakkelijker te laten communiceren.
Slanker schaduw DOM
De Shadow DOM polyfill is een verbazingwekkend staaltje techniek. Het is ontworpen om alomvattend te zijn en aan de specificaties te voldoen, wat belangrijk is voor het grondig testen van het primitieve platform, maar introduceert helaas een aantal prestatieknelpunten voor functies die Polymer niet gebruikt.
De volgende release van Polymer zal een andere aanpak volgen, waarbij gebruik wordt gemaakt van een shim-achtige laag die alleen polyfills bevat wat Polymer nodig heeft.
De bestaande polyfill zal voortleven voor generieke, niet-polymeer webcomponenten.
Verhuizing naar webcomponents.org
Over polyfills gesproken, die krijgen ook een nieuw huis. Momenteel zijn veel ontwikkelaars verward over de relatie tussen Polymer en Web Components. Sommigen denken dat je heel Polymer moet gebruiken om Web Components te gebruiken, terwijl je in feite alleen de polyfills nodig hebt.
Om dit onderscheid duidelijker te maken, worden de polyfills verplaatst naar webcomponents.org en zijn ze nu hernoemd naar webcomponents.js .
Deze stap is bedoeld om andere bibliotheekauteurs te helpen zonder enige verwarring van de polyfills te profiteren. Het Polymer-team zal blijven bijdragen aan de polyfills, maar de hoop is dat deze verandering er meer een gedeelde hulpbron voor de gemeenschap van maakt.
Resultaten
Dus wat zijn de resultaten van al deze veranderingen?
Snelheid
Op Chrome is Polymer nu 5x sneller , en op Safari is er een 8x snelheid bereikt .
Bestandsgrootte
De bestandsgrootte is ook met 87% verkleind, van 123 KB naar 15 KB (6 KB gezipt).
Routekaart
Er zullen enkele API-brekende wijzigingen plaatsvinden in de volgende release, aangegeven door het nieuwe versienummer (0.8), maar het team wil duidelijk maken dat dit geen herschrijving is. Het verplaatsen van uw huidige project van Polymer 0,5 naar 0,8 zou tamelijk triviaal moeten zijn.
Het Polymer-team heeft ook een routekaart geschetst om ontwikkelaars meer duidelijkheid te geven over aankomende releases.
De preview van versie 0.8 is nu beschikbaar als branch op GitHub (hoewel deze nog steeds zeer actief wordt ontwikkeld en de documentatie ontbreekt). De officiële bètaversie van 0,9 staat gepland voor het eerste kwartaal van 2015, terwijl versie 1,0 ergens in het tweede kwartaal zal plaatsvinden.
Het experiment is voorbij
Met alle recente veranderingen in Polymer legt het team erachter de basis voor Web Components om een integraal onderdeel te worden van de stapel van elke ontwikkelaar. Als u nieuw bent bij Web Components, is dit een goed moment om er eens naar te kijken en vertrouwd te raken met deze transformatieve technologieën. Als je al met componenten (en polymeer) werkt, ziet de toekomst er inderdaad rooskleurig uit. Houd de Polymer Blog in de gaten voor de laatste updates en meld je aan voor de Polymer mailinglijst voor vragen of opmerkingen. Veel hackplezier!