Best component based framework

What we can choose ?

  • webcomponents.js GitHub stars
  • Polymer GitHub stars

  • sketejs GitHub stars

  • Riot.js GitHub stars
  • mithril.js GitHub stars
  • Vue GitHub stars

  • ember.js GitHub stars

  • React GitHub stars
  • inferno GitHub stars
  • Preact GitHub stars

webcomponents.js

  • +1, Close to standards.
  • +1, Good for future.
  • -1, Complex polyfill (css, shadow dom, custom element).
  • -1, Mess code style (compiled to es5 for lower browser & need es5-loader for modern browser).
  • -1, Bad browser compatibility, IE 10+, Android 4.4+.
// in component
var currnetScript = document.currentScript || document._currentScript

// Listen to WebComponentReady to start your bussiness.

Polymer

  • -1, We should use bower to install dependencies.
  • -1, Too bundle with polymer build --bundle or too separate with polymer build --js-compile which should depends on HTTP/2.
  • -1, Not so easy to start, not so easy to build with other framework.
  • -1, Bad browser compatibility. Android 4.4+, IE 10+.
  • +1, Close to standards.

riot

Simple and elegant component-based UI library

  • -1, Not standard.
  • +1, Easy to use.
  • +1, Wild browser supported, IE 9+.

How to use it ?

// online demo: http://riotjs.com/examples/plunker/?app=timer
// Component
<timer>
  <p>Seconds Elapsed: { time }</p>
  <script>
    this.time = opts.start || 0
    tick() {
      this.update({ time: ++this.time })
    }
    var timer = setInterval(this.tick, 1000)
    this.on('unmount', function() {
      clearInterval(timer)
    })
  </script>
</timer>

// Use it
<timer></timer>
<script src="timer.tag" type="riot/tag"></script>
<script src="https://rawgit.com/riot/riot/master/riot%2Bcompiler.min.js"></script>
<script> riot.mount('timer', { start: 0 }) </script>

Vue

  • +1, Browser support, IE 9+.

React

  • +1, Stable.
  • +1, Popular.
  • -1, Need compiler like webpack.
  • -1, Not html-based but JSX.

React-like: inferno, Preact

Preact

Fast 3kb React alternative with the same ES6 API. Components & Virtual DOM.

inferno

An extremely fast, React-like JavaScript library for building modern user interfaces

mithril

A Javascript Framework for Building Brilliant Applications (development repo).

  • +1, Browser support, IE 9+.

Benchmark