Polymer (library)

Last updated
Polymer
Developer(s) Google [1] and contributors [2]
Initial releaseMay 29, 2015;7 years ago (2015-05-29) [3]
Stable release
1.x 1.12.0 / 21 May 2019;3 years ago (2019-05-21) [4]
2.x2.8.0 / 24 June 2019;3 years ago (2019-06-24) [4]
Repository polymer
Written in JavaScript, HTML
Type JavaScript library
License 3-Clause BSD [5]
Website www.polymer-project.org

Polymer is an open-source JavaScript library for building web applications using Web Components. The library is being developed by Google developers and contributors on GitHub. Modern design principles are implemented as a separate project using Google's Material Design design principles.

Contents

Polymer is used by a number of Google services and websites, including YouTube, YouTube Gaming, the redesigned Google Earth (since 2017), [6] Google I/O 2015 and 2016 websites, Google Play Music, redesign of Google Sites [7] and Allo for web (until its shutdown in 2019). [8]

Other notable users include Netflix, Electronics Arts, Comcast, Nuxeo, Coca-Cola, McDonald's, BBVA, IBM and General Electric.

History

Public development of Polymer began in November 2013 with the release of a Promises Polyfill. This steadily expanded into a web design library covering visual styling guidelines (via Material Design), data binding, and a large number of "Core" and "Paper" Web Components. Core components were originally envisioned to encompass generic functionality that would be essential to most websites, while Paper components were intended to provide more specialized components with Material Design concepts forming a key part of their design. A major milestone was reached with the release of Version 0.5, which was considered the first version of the project ready for use by early adopters. [9]

Google continued to revise the design of Polymer after the release of 0.5, with special consideration given to the performance issues a number of developers found. This culminated with the release of Polymer 1.0 in 2015, which was the first "production ready" version of the library. [10] Version 1.0 significantly improved the performance of Polymer, reducing load times by up to 7 times. [11] With version 1.0 Google split the elements from the Polymer project to clearly distinguish the elements catalog from the Polymer polyfill & webcomponents-sugaring library.

On 14–15 September 2015, Google organized a Polymer Summit in Amsterdam.

On 17–18 October 2016, Google organized a Polymer Summit in London.

On 22–23 August 2017, Google organized a Polymer Summit in Copenhagen.

On 2 May 2018, the Polymer team announced that any future development in Polymer will shift away from its two-way binding and its template system, and will focus on LitElement [12] (still part of Polymer [13] ) and one-way bindings. [14]

Features

Polymer provides a number of features over vanilla Web Components:

Usage

Polymer has begun to gain increasing recognition in the market, with spikes in use in 2015 and 2016 as documented by the website BuiltWith. [15] Special attention has been paid to its structured design process, allowing for an interoperable "Lego Block" structure. [16] Lit Element was developed by the Google Chrome team as part of the Polymer project in 2018. Lit Element was designed to be a lightweight and easy-to-use framework for creating web components that can be used with any front-end framework or library.

Custom elements

Custom elements can be created using ES (ECMAScript, most commonly JavaScript) modules with classes. Custom element definition comprises CSS style, HTML template of the element's local DOM, element properties, lifecycle callbacks and JavaScript methods:

import{PolymerElement,html}from'@polymer/polymer'classHelloElementextendsPolymerElement{// Define the element's templatestaticgettemplate(){returnhtml`        <style>        /* Local DOM CSS style */        </style>        <!-- Local DOM -->        Hello {{name}}!        `;}staticgetis(){return'hello-element';}// Define public API propertiesstaticgetproperties(){return{name:{type:String}};}}window.customElements.define(HelloElement.is,HelloElement);

The element defined above can be used in HTML code:

<hello-elementname="World"></hello-element>

See also

Related Research Articles

<span class="mw-page-title-main">Apache Tapestry</span> Open-source web application framework

Apache Tapestry is an open-source component-oriented Java web application framework conceptually similar to JavaServer Faces and Apache Wicket. Tapestry was created by Howard Lewis Ship, and was adopted by the Apache Software Foundation as a top-level project in 2006.

ASP.NET AJAX, formerly called Atlas, is a set of extensions to ASP.NET developed by Microsoft for implementing Ajax functionality. It is released under the Microsoft Public License (Ms-PL).

<span class="mw-page-title-main">YUI Library</span>

The Yahoo! User Interface Library (YUI) is a discontinued open-source JavaScript library for building richly interactive web applications using techniques such as Ajax, DHTML, and DOM scripting. YUI includes several core CSS resources. It is available under a BSD License. Development on YUI began in 2005 and Yahoo! properties such as My Yahoo! and the Yahoo! front page began using YUI in the summer of that year. YUI was released for public use in February 2006. It was actively developed by a core team of Yahoo! engineers.

jQuery is a JavaScript framework designed to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax. It is free, open-source software using the permissive MIT License. As of Aug 2022, jQuery is used by 77% of the 10 million most popular websites. Web analysis indicates that it is the most widely deployed JavaScript library by a large margin, having at least 3 to 4 times more usage than any other JavaScript library.

Svelte is a free and open-source front end component framework or language created by Rich Harris and maintained by the Svelte core team members. Svelte is not a monolithic JavaScript library imported by applications: instead, Svelte compiles HTML templates to specialized code that manipulates the DOM directly, which may reduce the size of transferred files and give better client performance. Application code is also processed by the compiler, inserting calls to automatically recompute data and re-render UI elements when the data they depend on is modified. This also avoids the overhead associated with runtime intermediate representations, such as virtual DOM, unlike traditional frameworks which carry out the bulk of their work at runtime, i.e. in the browser.

A single-page application (SPA) is a web application or website that interacts with the user by dynamically rewriting the current web page with new data from the web server, instead of the default method of a web browser loading entire new pages. The goal is faster transitions that make the website feel more like a native app.

<span class="mw-page-title-main">Vaadin</span>

Vaadin is an open-source web application development platform for Java. Vaadin includes a set of Web Components, a Java web framework, and a set of tools that enable developers to implement modern web graphical user interfaces (GUI) using the Java programming language only, TypeScript only, or a combination of both.

<span class="mw-page-title-main">Google Closure Tools</span> JavaScript developer toolkit

Google Closure Tools is a set of tools to help developers build rich web applications with JavaScript. It was developed by Google for use in their web applications such as Gmail, Google Docs and Google Maps.

In web development, a polyfill is code that implements a feature on web browsers that do not natively support the feature. Most often, it refers to a JavaScript library that implements an HTML5 or CSS web standard, either an established standard on older browsers, or a proposed standard on existing browsers. Formally, "a polyfill is a shim for a browser API."

AngularJS is a discontinued free and open-source JavaScript-based web framework for developing single-page applications. It was maintained mainly by Google and a community of individuals and corporations. It aimed to simplify both the development and the testing of such applications by providing a framework for client-side model–view–controller (MVC) and model–view–viewmodel (MVVM) architectures, along with components commonly used in web applications and progressive web applications.

<span class="mw-page-title-main">Bootstrap (front-end framework)</span> Web design front-end framework

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains HTML, CSS and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.

Foundation is a free responsive front-end framework, providing a responsive grid and HTML and CSS UI components, templates, and code snippets, including typography, forms, buttons, navigation and other interface elements, as well as optional functionality provided by JavaScript extensions. Foundation is an open source project, and was formerly maintained by ZURB. Since 2019, Foundation has been maintained by volunteers.

<span class="mw-page-title-main">Elm (programming language)</span> Functional programming language

Elm is a domain-specific programming language for declaratively creating web browser-based graphical user interfaces. Elm is purely functional, and is developed with emphasis on usability, performance, and robustness. It advertises "no runtime exceptions in practice", made possible by the Elm compiler's static type checking.

<span class="mw-page-title-main">Ember.js</span>

Ember.js is an open-source JavaScript web framework that utilizes a component-service pattern. It allows developers to create scalable single-page web applications by incorporating common idioms, best practices, and patterns from other single-page-app ecosystem patterns into the framework.

XHP is an augmentation of PHP and Hack developed at Meta to allow XML syntax for the purpose of creating custom and reusable HTML elements. It is available as an open-source software GitHub project and as a Homebrew module for PHP 5.3, 5.4, and 5.5. Meta also developed a similar augmentation for JavaScript, named JSX.

Web Components are a set of features that provide a standard component model for the Web allowing for encapsulation and interoperability of individual HTML elements. Web Components are popular approach to build microfrontend.

<span class="mw-page-title-main">React (software)</span> JavaScript library for building user interfaces

React is a free and open-source front-end JavaScript library for building user interfaces based on components. It is maintained by Meta and a community of individual developers and companies.

JSX is an extension to the JavaScript language syntax which provides a way to structure component rendering using syntax familiar to many developers commonly used in React. It is similar in appearance to HTML.

<span class="mw-page-title-main">Vue.js</span> Open-source JavaScript framework for building user interfaces

Vue.js is an open-source model–view–viewmodel front end JavaScript framework for building user interfaces and single-page applications. It was created by Evan You, and is maintained by him and the rest of the active core team members.

<span class="mw-page-title-main">Angular (web framework)</span> Open source web application framework

Angular is a TypeScript-based, free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS. Angular is a Single Page Application (SPA) Framework which is used for creating Fast Web Applications. It uses concepts of SPA in which UI is delivered in the beginning of application request and later only data is requested which makes SPA applications fast.

References

  1. ↑ "AUTHORS.txt" . Retrieved 18 August 2017.
  2. ↑ "CONTRIBUTORS.txt" . Retrieved 18 August 2017.
  3. ↑ "1.0". Polymer Project. Retrieved 18 August 2017.
  4. 1 2 "Releases · Polymer/polymer". GitHub. Retrieved 4 September 2019.
  5. ↑ "polymer/LICENSE.txt at master". GitHub. Retrieved 24 April 2017.
  6. ↑ Bidelman, Eric (2017-04-18). "Mission accomplished: has been componentized. New @googleearth is built w/ #WebComponents using @polymer.pic.twitter.com/h76ztfynYy". @ebidel. Retrieved 2017-07-08.
  7. ↑ "Meet Google Drive – One place for all your files". accounts.google.com. Retrieved 2021-06-21.
  8. ↑ "Who's using Polymer?". GitHub. Retrieved 4 June 2016.
  9. ↑ "Polymer gives us a closer look at Google's Material Design UI". Android Authority.
  10. ↑ Steven Max Patterson (29 May 2015). "Google's Polymer 1.0 brings reuse and better branding to Web development". CIO.
  11. ↑ "Welcome - Polymer 1.0". Archived from the original on 2015-08-14.
  12. ↑ "Roadmap update, part 1: 3.0 and beyond".
  13. ↑ "Justin Fagnani on Twitter". Twitter. Retrieved 2018-05-14.
  14. ↑ "Roadmap update, part 2: FAQ - Polymer Project". www.polymer-project.org. Retrieved 2018-05-14.
  15. ↑ "Polymer Usage Statistics". BuiltWith. March 2019. Retrieved 30 May 2019.
  16. ↑ Allie Coyne (13 August 2015). "Inside ING Direct's new lego block app architecture". iTnews.
This page is based on this Wikipedia article
Text is available under the CC BY-SA 4.0 license; additional terms may apply.
Images, videos and audio are available under their respective licenses.