ReactFoo Mumbai

ReactFoo Mumbai

On React, alternatives to React, ReactNative and front-end engineering

Aziz Khambati

@azizhk110

Create your own Custom Async Renderer with diffing in Web Worker

Submitted Apr 16, 2018

I’ll be going through some of the design of react-reconciler, fibre and how to create your own custom renderer.

Outline

  • Async Rendering (Pros & Cons, Limitations)
  • React Reconciler
  • Web Worker
  • Fiber - Mutations & Message Passing
  • Data Structures for VDOM
  • How to traverse VDOM for chunking render and how to use requestIdleCallback
  • Whats missing? What to expect from future versions of React

I will be discussing how we can go from
Sync Rendering Example [ https://azizhk.github.io/rrrww/ ]
to
Async Rendering Example [ https://azizhk.github.io/rrrww/async/index.html ]

Requirements

Curiosity to learn internals of React

Speaker bio

Hey, I’m a frontend dev at Anarock, previously at Housing.com

Slides

https://drive.google.com/file/d/1AOGiEXloRxH5QB2TiN3tQpmXWuTxqhBU/view?usp=sharing

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

A community - for and of - front-end engineers to share experiences with ReactJS, performant apps with React, crafting better User Interfaces (UI) with React and GraphQL ecosystem. ReactFoo also discusses design patterns and user experience. more