• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

I Like Kill Nerds

The blog of Australian Front End / Aurelia Javascript Developer & brewing aficionado Dwayne Charrington // Aurelia.io Core Team member.

  • Home
  • Aurelia 2
  • Aurelia 1
  • About
  • Aurelia 2 Consulting/Freelance Work

What Is The Difference Between Google Polymer and AngularJS?

General · December 6, 2014

There is some confusion around what the difference between Google Polymer and AngularJS is. Both being Google supported initiatives, lets clear up the misconceptions and explain the differences.

Google Polymer

Essentially Google Polymer is for creating Web Components. Self contained modules written in HTML and used similarly to AngularJS directives using the type of “E” for element.

Web Components are a W3C standard, although not finalised or fully implemented in all browsers, Polymer is a set of polyfills for implementing cross-browser Web Components.

Essentially a Web Component is a self contained element that can have its own HTML, JS and CSS separate from the DOM itself. For example, HTML5 elements like <video> and <audio> are Web Components. They contain many HTML elements inside of them and if you inspect the Shadow Dom inside of a browser like Chrome, you can see these simple elements are not so simple.

AngularJS

The difference between an AngularJS directive and Google Polymer is the fact your custom elements using Angular directives do not support their own encapsulated CSS or JS, this needs to be handled within the directive declaration itself.

Having said that, you can almost get the same functionality of a Web Component using an Angular directive, but minus the ability to have its own encapsulated assets independent of the page itself.

Conclusion

While Polymer and AngularJS are two different beasts, eventually we will see Polymer integrated into Angular, perhaps version 2.0 as major API changes in Angular bring forth better modern browser support.

Web Components are a W3C standard, Angular is not. Through the use of polyfills and other syntactic sugar, Polymer is an intermediate step on the road to browser support for Web Components. The best browser out there that supports the current spec is Chrome, especially version 36 onwards. Although Firefox is slowly implementing support for Web Components, it will take time.

So while you can achieve the appearance of a web component with Angular directives, if encapsulation matters to you, Polymer might be a better choice for your needs.

Dwayne

Leave a Reply Cancel reply

0 Comments
Inline Feedbacks
View all comments

Primary Sidebar

Popular

  • How To Get The Hash of A File In Node.js
  • Testing Event Listeners In Jest (Without Using A Library)
  • Which Neural DSP Archetype Plugins Should You Buy?
  • Smoke Detector Randomly Goes Off Early Hours of The Morning
  • How to Fast Launch Microsoft Flight Simulator 2020 (decrease game loading time)
  • How to Copy Files Using the Copy Webpack Plugin (without copying the entire folder structure)
  • A review of the Neural DSP Quad Cortex: is this the future of amp-modelling?
  • NBN Box Installed Inside of Garage, Where Do You Put The Modem?
  • How To Mock uuid In Jest
  • Convert A Firebase Database Snapshot/Collection To An Array In Javascript

Recent Comments

  • Thebe on How to Remove the My Sites Menu From the WordPress Admin Bar
  • Maccas worker jn the 2000s on Dear McDonald’s: bring back the Warm Cookie Sundae, you cowards
  • Anamika Singh on Testing Event Listeners In Jest (Without Using A Library)
  • Stefan on A List of WordPress Gutenberg Core Blocks
  • pandammonium on A List of WordPress Gutenberg Core Blocks

Copyright © 2022 · Dwayne Charrington · Log in

wpDiscuz