ReactFoo Delhi

ReactFoo Delhi

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 Jun 25, 2018

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

Outline

  • Async Rendering (Pros & Cons, Limitations)
  • React Reconciler
  • Web Worker
  • React Fiber
  • Async Rendering pros and reasons for architecture rewrrite, what the current algo did not support.
  • 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