Pros and Cons of Facebook's React vs. Web Components (Polymer) [closed]

Question

Closed. This question is opinion-based. It is not currently accepting answers.

---

Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.

Closed 8 years ago.

Improve this question

What are the main benefits of Facebook's React over the upcoming Web Components spec and vice versa (or perhaps a more apples-to-apples comparison would be to Google's Polymer library)?

According to this JSConf EU talk and the React homepage, the main benefits of React are:

• Decoupling and increased cohesion using a component model
• Abstraction, Composition and Expressivity
• Virtual DOM & Synthetic events (which basically means they completely re-implemented the DOM and its event system)
  • Enables modern HTML5 event stuff on IE 8
  • Server-side rendering
  • Testability
  • Bindings to SVG, VML, and <canvas>

Almost everything mentioned is being integrated into browsers natively through Web Components except this virtual DOM concept (obviously). I can see how the virtual DOM and synthetic events can be beneficial today to support old browsers, but isn't throwing away a huge chunk of native browser code kind of like shooting yourself in the foot in the long term? As far as modern browsers are concerned, isn't that a lot of unnecessary overhead/reinventing of the wheel?

Here are some things I think React is missing that Web Components will care of. Correct me if I'm wrong.

• Native browser support (read "guaranteed to be faster")
• Write JavaScript in vanilla JavaScript, write CSS in CSS, write HTML in HTML.
• Style encapsulation using Shadow DOM
  • React instead has this, which requires writing CSS in JavaScript. Not pretty.
• Two-way binding