Re:Progressive React
by wolco on Friday December 20, 2019 @08:03PM
(#21848830)
Is there a way to cutdown the bloat?
[ Parent
| on HN ]
Re:Progressive React
by munchbunny on Friday December 20, 2019 @08:32PM
(#21848963)
Not in a substantial way. The boilerplate is a consequence of the functional “workaround”: representing a mutation as the result of applying a state transition to a complex state, and then computing what to display as a function of both the current and previous states.
The way to reduce the boilerplate is to use a mutable paradigm, but then you lose the simplifications that the immutable paradigm gives you.
There's a fantastic library called Immer [0] that uses ES6 Proxies to let you write "mutative" update logic that is tracked and turned into a safe immutable update.
We recommend using Immer as the best way to write immutable logic with Redux [1], and our new Redux Toolkit package [2] automatically uses Immer internally to let you write reducers like this:
const reducer = createReducer(initialState, {
updateItem(state, action) {
state.first.second[action.payload.id].fourth = action.payload.value
}
})
[0] https://immerjs.github.io/immer/[1] https://redux.js.org/style-guide/style-guide/#use-immer-for-...
Check out lit-html. You write functional style code, but the library does efficient minimal mutations of the dom with no virtual dom, and no dom diffing.
Re:Progressive React
by Richicoder on Friday December 20, 2019 @08:37PM
(#21848982)
I'd recommend checkout out Redux Toolkit and reading over the docs. Severely cuts down the boilerplate, but still walks you through the general ideas and fundamentals in a great way.