redux

Introduction React useContext is very handy to avoid prop drilling. It can be used to define global state or shared state that multiple components in the tree can access. However, useContext is not specifically designed for global state and there’s a caveat. Any change to context value propagates all useContext to re-render components. This post shows some example code about the problem and the solution with state usage tracking. Problem Let’s assume a person object as a state....

Introduction React-Redux provides hooks API with nice abstraction. Especially, useSelector is probaly less misused than mapStateToProps. react-tracked is a library for global state without Redux. This library provides almost compatible hooks API to React-Redux. It’s developed with performance in mind, and it should be as performant as React-Redux, even though it utilizes only React context. See the GitHub repo for more information. https://github.com/dai-shi/react-tracked This post shows benchmark results to convince that it actually is performant in one scenario....

Introduction Recently, React Redux released hooks API. It’s v7.1.0-alpha.4 as of writing. https://github.com/reduxjs/react-redux/releases/tag/v7.1.0-alpha.4 On the other hand, I’ve been developing a new React Redux binding library with hooks and Proxy. https://github.com/dai-shi/reactive-react-redux It’s time to benchmark both of them to have better understanding in performance. The reactive-react-redux library utilizes Proxy to auto-detect state usage, hence it technically has overhead which would affect performance. We would like to learn how much it will be affected in a realistic example....

Background Ever since I learned Redux, I’ve been thinking an alternative integration of react and redux to the official react-redux library. The intuition behind it is that Redux is super simple which I like a lot, whereas react-redux is complex because of performance tuning. If you are developing a business product, the official react-redux is to go without a doubt, but if you are playing with creating a toy app or you are just starting learning Redux, you might want something more straightforward....

Introduction It’s been a while since I started developing reactive-react-redux and react-tracked. These libraries provide so called state usage tracking to optimize render in React. This approach, I think, is pretty novel and quite a lot of my effort has been put to improve its performance. Lately, I thought it would be nicer if this can be used more broadly. I wondered if it can be used in vanilla JS. What would be an API in vanilla JS?...