Create your own Custom Async Renderer with diffing in Web Worker – ReactFoo Mumbai

All submissions

Previous Next

Create your own Custom Async Renderer with diffing in Web Worker

Submitted Apr 16, 2018

Technical level: Advanced

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

All submissions

Previous Next

Comments

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

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

{{ gettext('New comment') }}

{{ formTitle }}

{{ errorMsg }}

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

Previous Next

State management with context api

Building on the idea of unstated and react waterfall, I would present a simple library created with the context api. This would explain how we can use context api to build our own mini redux system with multiple stores and one single global store. more

23 May 2018