Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ


Choose your language

InfoQ Homepage News Polymer 2.0 Introduces Breaking Changes But the Migration Has Been Smoothed

Polymer 2.0 Introduces Breaking Changes But the Migration Has Been Smoothed

Polymer 2.0 replaces Custom Elements API v0 with v1, deprecates Polymer.dom, uses Shadow DOM instead, but the migration path is not so steep as these changes suggest, because they have introduced a compatibility layer that enables code created with Polymer 1.7+ to run under 2.0

Polymer 1.+ was built on Custom Elements API v0, which has been deprecated, a custom element being initialized with document.registerElement(). Polymer 2.0 uses instead customElements.define(), which is how a new element is created under the Custom Elements API v1. This latest version of the API is to be supported by all the major browsers soon. Chrome 54+ has already implemented it, as Safari TP has it, while Edge and Firefox have started working on it. (More details on the current implementation status can be found here.) In the meantime, this polyfill can be used to add support for custom elements to all browsers.

Another important change is the deprecation of the Polymer.dom, being replaced with Shadow DOM v1 which has been implemented by browsers or it is under development. The shady DOM has been extracted out of Polymer and provided as a polyfill.

Regarding the data system, Polymer 2.0 introduces a number of enhancements: no more dirty checking for objects and arrays, simpler handling of arrays, data change notifications are batched, and others.

To avoid the damage that could be done by breaking changes, Google has introduced a compatibility layer that allows custom elements created with Polymer 1.7+ to work under 2.0. Developers will only need to “adapt existing code to be compliant with the shadow DOM v1 API related to content distribution and styling, as well as minor breaking changes introduced due to changes in the custom elements v1 API.” Polymer also introduces hybrid elements that makes them compatible with Polymer 1.x. At some point, a tool will be made available for automatic conversion of custom elements created with Polymer 1.x to 2.0.

Custom elements are defined in Polymer 2.0 using the class syntax available in ES6. The factory method existing in Polymer 1.x can be used through the compatibility layer.

Polymer 2.0 Preview is available to developers but it is under heavy development and it is not recommended for production yet. Polymer 2.0 GA will be released some time during Q1/2017.

Rate this Article