Future, Faster: Unlock the Power of Web Components With Polymer — Google I/O 2017 Live Blogs

Web Components are a means of creating reusable encapsulated components to push the web platform further. While Web Components are a native concept, not all browsers support it yet, and they can still be quite difficult to use. Polymer, the javascript library by Google, solves both problems, and this year at I/O Google Announced Polymer 2.0. We were there in the crowd, live blogging. #UseThePlatform

Approximate Read Time: 2 Minutes

Often when you are developing a website, you find yourself reusing large chunks of html code repeatedly. If you later decide you want to update the html of these reused components, you have to change the html in multiple places to accomplish that. This is just one of the problems that Web Components helps solve. Web Components let you create your own HTML elements and control the way these elements are rendered.

While Web Components, which are based on the Shadow DOM standard, are a native browser technology, it has taken time for the various browsers to integrate the standard into their browsers.  This often happens whenever something new is added to the web platform, and the solution today is the same as it has been in the past, Polyfills.  A Polyfill is a piece of code that enables technologies that your browser doesn’t yet support.

Fortunately the Browsers are catching up with the standards.   Apple added support for Shadow DOM in Safari 10.0 which makes Web Components natively possible in Safari (including on iOS) without a Polyfill.  Firefox is currently working on developing Shadow DOM support into their browser and Microsoft is considering adding support to their Edge browser.  Eventually once all browsers support Web Components natively, we can stop using Polyfills to enable the power of Web Components, in the mean time however, there is Polymer.

Polymer is a javascript library created by Google that acts as a Polyfill for browsers that don’t yet support Web Components, and as a framework to vastly simplify the task of creating and using web components.  It has gained massive popularity over time among proponents of Web Components, used by developers of sites both large and small.  Within Google, Polymer is the most common imported requirement across all projects.

Just before Google I/O this year, Google released Polymer 2.0, a massive upgrade over the original Polymer library.  Polymer 2.0 ads a ton of new functionality and features to Polymer making developing and using Web Components easier than before, yet still manages to weigh in at just 1/4 the size of the previous release.  At the same time the Polymer team has managed to make components that were designed for Polymer 1 still work 100% making it completely backwards compatible.

Polymer 2.0 is a great weapon in the web developer’s arsenal to help them #UseThePlatform to make the web platform even better.

Session Video

Live Blog Transcript