ReactFoo-VueDay Pune edition

State is like a film reel (Quite Literally) & you need to set the right FPS for your user. Discover how to improve rendering performance of your react app using batched actions, action queue & throttling. Find out how to design your own middlewares to instrument action dispatching for performance.

Outline

• How state is like a film reel? See redux in motion.
• Dispatch Dispatch Everywhere! Centralized store but localised action dispatching. How to make minimum updates to the store?
• How to mitigate intermediate states to avoid undesired state, hollow re-renders & improve render performance?
• Discover your new super power - Batched Actions, minimize the number of React re-renders by batching actions.
• Designing an Action Queue for your store - Enable, Flush, Priority, Size, Queue Jumpers.
• Throttle actions which can wait - ThrottleQueue for high frequency & low priority actions.
• Put a knob on that store! Yes you need to, Every app is not the same. (Intro to redux-knob)
• Orchestrate multiple Action Queues with a Queue Factory.
• Ideas around different queue strategies, like scheduling actions based on priority, buffer & time based.

Requirements

Basic understanding of Redux.

Speaker bio

Sr.UI Engineer at kubric.io, BlrCSS Organizer
Open Source contrubutor, Google Code In Mentor 2017, 2018
Ex GDG Organizer, Talk to me - React, CSS, Firebase, PWA & Pets.
I love drawing on Codepen codepen.io/thewizardjs

Links

• https://docs.google.com/presentation/d/1Sd8lmQvdgDtOEAEdY_F2bPy9_GYhbbvm2VGtcuPHFeo/edit?usp=sharing
• https://www.meetup.com/ReactJS-Bangalore/events/262868578/
• https://github.com/cirbuk/redux-knob
• https://github.com/tstreamDOTh/

Slides

https://docs.google.com/presentation/d/1Sd8lmQvdgDtOEAEdY_F2bPy9_GYhbbvm2VGtcuPHFeo/edit?usp=sharing