1 min read

MeteorJS, Polymer, Angular, Web Components UI, Virtual/Shadow DOM and the future

Javascript is still evolving at high pace, every time you start a new project you have to reconsider the technologies you used in the past one and you have to make a new compromise.

enter image description here

This also means that you can’t evolve your project in a predictable way, a part of your future time will be spent to fix bad design, broken API and moving parts (see also The State of JavaScript in 2015 with AngularJS 2.0 drama).

Below some key concepts and options you have.

Shadow DOM vs Virtual DOM

Conceptually they are the same, when a list of item changes, you want to replace just the items or the parts that are changed an maintain the existing rendered list of elements in the DOM as is.

  • Meteor(Blaze) and React have Virtual DOM
  • Polymer has Shadow DOM, which is native in Chrome and works with polyfill in other browsers

Components UI (in sandbox)

Some rich UI components should be data agnostic and reusable (at least inside projects which use the same CSS conventions).
It also means that the js needed in the view doesn’t have to leak outside.

I just want Material design for a new project.. what do do? :D

Use Polymer + Paper elements or if you are a Meteor fan, Materialize + grigio:materialize-sass + write your own js to activate the components with Blaze.