React’s Virtual DOM (Document Object Model) & the browser DOM  are very different in their approach. Virtual DOM prefers to keep it’s logic and changes in JavaScript and eventually optimizes output to the browser DOM at the most critical moment that provides performance boosts while the browser DOM utilizes the traditional way of working with the document, accessing HTML directly, working with browser events, and manipulating state. The performance gains from a Virtual DOM approach are outstanding despite the fact that events, css, markup, and ‘all-of-the-things’ are stubbed, recreated, or handled in some way inside the JavaScript. Browser DOM, on the other hand, handles everything in the global document and leverages JavaScript, CSS, and other resources directly. Surely these approaches are not good to use together.
 
Wrong!
Andrew Rota (@AndrewRota) & Denis Radin (@PixelsCommander) talk about the ways you can leverage both Web Components & React.js together in a symbiotic fashion. Denis, creator of Reactive Elements, starts us off explaining how his library came to be and why he chose to marry these two technologies in his work. Andrew, who spoke at ReactConf 2015 talks about his experiences with Web Components & React.
Resources


Reactive Elements - https://github.com/PixelsCommander/ReactiveElements


Component Interop With React And Custom Elements - http://addyosmani.com/blog/component-interop-with-react-and-custom-elements/


Pros/Cons of React vs. Web Components - http://programmers.stackexchange.com/questions/225400/pros-and-cons-of-facebooks-react-vs-web-components-polymer


Combining React, Flux & Web Components - http://futurice.com/blog/combining-react-flux-and-web-components


Complementarity of React and Web Components - http://webcomponents.org/presentations/complementarity-of-react-and-web-components-at-reactjs-conf/


React vs. Polymer - https://news.ycombinator.com/item?id=8050649


React Demystified - http://blog.reverberate.org/2014/02/react-demystified.html


Rob Dodson’s experiments with React & Web Components - https://github.com/robdodson/react-polymer


Front End Tower of Babylon - http://www.slideshare.net/DenisRadin/frontend-tower-of-babylon




React vs. Web Components article - https://www.pandastrike.com/posts/20150311-react-bad-idea


 
Panelists


Erik Isaksen - UX Engineer at3Pillar Global


Nick Niemeir - JavaScript Agent Engineer at New Relic

Ver todos los episodios