Polymer (library)
{{Short description|Open-source JavaScript library of Web Components}}
{{Infobox software
| name = Polymer
| logo = File:Polymer Project logo.png
| developer = Google{{cite web|title= AUTHORS.txt|url=https://polymer.github.io/AUTHORS.txt|access-date=18 August 2017|language=en}} and contributors{{cite web|title=CONTRIBUTORS.txt|url=https://polymer.github.io/CONTRIBUTORS.txt|access-date=18 August 2017|language=en}}
| released = {{Start date and age|2015|05|29}}{{cite web|title=1.0|url=https://www.polymer-project.org/blog/2015-05-29-one-dot-oh.html|website=Polymer Project|access-date=18 August 2017|language=en}}
| latest release version = {{Multiple releases
|branch1 = 1.x
|version1 = 1.12.0
|date1 = {{Start date and age|df=yes|2019|05|21}}{{cite web|title=Releases · Polymer/polymer|url=https://github.com/Polymer/polymer/releases|website=GitHub|access-date=4 September 2019|language=en}}
|branch2 = 2.x
|version2 = 2.8.0
|date2 = {{Start date and age|df=yes|2019|06|24}}
|branch3 = 3.x
|version3 = {{wikidata|property|edit|reference|P348}}
|date3 = {{start date and age|{{wikidata|qualifier|P348|P577}}}}
}}
| latest release date =
| latest preview version =
| latest preview date =
| repo = {{GitHub|https://github.com/Polymer/polymer|link=hidden}}
| programming language = JavaScript, HTML
| genre = JavaScript library
| license = 3-Clause BSD{{cite web|title=polymer/LICENSE.txt at master|url=https://github.com/Polymer/polymer/blob/master/LICENSE.txt|website=GitHub|access-date=24 April 2017|language=en}}
| website = {{URL|https://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.
Polymer is used by a number of Google services and websites, including YouTube, YouTube Gaming, the redesigned Google Earth (since 2017),{{Cite web|last=Bidelman|first=Eric|date=2017-04-18|title=Mission accomplished: has been componentized. New @googleearth is built w/ #WebComponents using @polymer.pic.twitter.com/h76ztfynYy|url=https://twitter.com/ebidel/status/854366654741991424|access-date=2017-07-08|website=@ebidel}} Google I/O 2015 and 2016 websites, Google Play Music, redesign of Google Sites{{Cite web|title=Meet Google Drive – One place for all your files|url=https://accounts.google.com/ServiceLogin?service=wise&passive=1209600&continue=https://sites.google.com/new&followup=https://sites.google.com/new|access-date=2021-06-21|website=accounts.google.com}} and Allo for web (until its shutdown in 2019).{{cite web|title=Who's using Polymer?|url=https://github.com/Polymer/polymer/wiki/Who's-using-Polymer%3F|website=GitHub|access-date=4 June 2016}}
Other notable users include Netflix, Electronics Arts, Comcast, Nuxeo, Coca-Cola, McDonald's, BBVA, IBM, Interxion 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.{{cite web|url=http://www.androidauthority.com/polymer-elements-material-design-397858/|title=Polymer gives us a closer look at Google's Material Design UI|work=Android Authority|access-date=2015-08-21|archive-date=2021-08-05|archive-url=https://web.archive.org/web/20210805140115/https://www.androidauthority.com/polymer-elements-material-design-397858/|url-status=dead}}
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.{{cite web|url=http://www.cio.com/article/2927587/web-development/google-polymer-brings-reuse-and-better-branding-to-web-development.html|title=Google's Polymer 1.0 brings reuse and better branding to Web development|author=Steven Max Patterson|date=29 May 2015|work=CIO|access-date=21 August 2015|archive-date=9 December 2018|archive-url=https://web.archive.org/web/20181209165439/https://www.cio.com/article/2927587/web-development/google-polymer-brings-reuse-and-better-branding-to-web-development.html|url-status=dead}} Version 1.0 significantly improved the performance of Polymer, reducing load times by up to 7 times.{{cite web|url=https://www.polymer-project.org/1.0/|title=Welcome - Polymer 1.0|url-status=dead|archive-url=https://web.archive.org/web/20150814004009/https://www.polymer-project.org/1.0/|archive-date=2015-08-14}} 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{{cite web|url=https://www.polymer-project.org/blog/2018-05-02-roadmap-update.html#libraries|title=Roadmap update, part 1: 3.0 and beyond}} (still part of Polymer{{Cite news|url=https://twitter.com/justinfagnani/status/994358200538349568|title=Justin Fagnani on Twitter|work=Twitter|access-date=2018-05-14|language=en}}) and one-way bindings.{{Cite web|url=https://www.polymer-project.org/blog/2018-05-02-roadmap-faq.html#can-i-keep-using-the-polymer-data-system|title=Roadmap update, part 2: FAQ - Polymer Project|website=www.polymer-project.org|language=en|access-date=2018-05-14}}
Features
Polymer provides a number of features over vanilla Web Components:
- Simplified way of creating custom elements
- Both One-way and Two-way data binding
- Computed properties
- Conditional and repeat templates
- Gesture events
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.{{cite web |title=Polymer Usage Statistics |url=https://trends.builtwith.com/javascript/Polymer |website=BuiltWith |access-date=30 May 2019 |date=March 2019}} Special attention has been paid to its structured design process, allowing for an interoperable "Lego Block" structure.{{cite web|url=http://www.itnews.com.au/News/407763,inside-ing-directs-new-lego-block-app-architecture.aspx|title=Inside ING Direct's new lego block app architecture|author=Allie Coyne|date=13 August 2015|work=iTnews}} LitElement was developed by the Google Chrome team as part of the Polymer project in 2018. LitElement 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'
class HelloElement extends PolymerElement {
// Define the element's template
static get template() {
return html`
/* Local DOM CSS style */
Hello {{name}}!
`;
}
static get is() { return 'hello-element'; }
// Define public API properties
static get properties() {
return {
name: {
type: String
}
};
}
}
window.customElements.define(HelloElement.is, HelloElement);
The element defined above can be used in HTML code:
See also
{{Portal|Free and open-source software}}
References
{{Reflist}}
External links
- {{Official website|https://www.polymer-project.org}}
- {{GitHub|https://github.com/Polymer/polymer}}
- {{URL|https://www.webcomponents.org/}}
{{Google FOSS}}
Category:Free computer libraries
Category:Free software programmed in JavaScript