ReactFoo Pune

On lessons learned during implementation.


Building custom renderers with React

Submitted by Satyajit Sahoo on Tuesday, 14 November 2017

Section: Full talk on success and failure stories with React; code overheads and code rewrite stories with React Technical level: Advanced Status: Confirmed & Scheduled

View proposal in schedule


React has enabled us to write complex UIs with a great declarative API. Under the hood, React’s reconciler optimizes by diffing the old and new tree, usually known as virtual DOM diffing. The latest version of React uses a Fiber architecture to implement the reconciler. The reconciler backs custom renderers like React DOM and React Native to target various platforms. In this talk we’ll implement a custom renderer with react-reconciler. We’ll also take a brief look at various custom renderers in the wild to have an idea of what can be acheived.


The talk will focus on the following key points

  • What is a custom renderer
  • Why should you build one
  • What is “fiber”
  • What is “reconciliation”
  • How to build a custom renderer with react-reconciler
  • Integration with React devtools
  • More resources on Fiber and custom renderers

Speaker bio

Satyajit Sahoo is a frontend developer at Callstack, and a core contributor to React Native. He is skilled in building React and React Native apps and has a good understanding of the internals.




  •   Tibo WEGMANS (@tiboo) 8 months ago

    hey thanks for the post. just started diving into reactJS for my seo project and your resources really helped me get through. Good work hasgeek.

    SEO Expert in Pakistan

Login with Twitter or Google to leave a comment