Imperative attack on react design: immerjs produceWithPatches

Immerjs becomes popular tool for react these days. It includes special function named produceWithPatches. This function can force react component to use imperative design only.

const state = { a: 1, b: 2 }
const [nextState, patches] = produceWithPatches(state, (draft) => {
  draft.b = 3
})

Steps To Reproduce

1. Use produceWithPatches and pass nextState as prop and patches as propPatches into component.
2. Component uses only initial prop value to create internal object.
3. Component uses propPatches to update internal object in imperative way.

The current behavior

1. Component is not responsible to prop updates anymore, it care only about propPatches.
2. If prop update doesn’t come from immerjs, than user have to provide propPatches by himself: find minimal changes to make nextProp equal to prevProp (DSU, tries, etc).

The expected behavior

1. Component should be responsible for prop value.
2. User should be able to provide only prop value without propPatches.

Please add recommendation into documentation: produceWithPatches from immerjs is not recommended for react. Thank you.

[gaearon]

I’m struggling to understand what is being suggested in this issue. There are infinitely many ways to use React, and generally there are some idiomatic patterns that you can find on the website. I don’t know enough about patches to confidently say whether this usage is idiomatic or not, but it’s also not common enough to warrant a notice on the React website either way. If this is something you feel strongly about, it sounds like a good candidate for a blog post on a personal blog.

[andrew-aladev]

@mweststrate, @gaearon Hello, you can’t find today many applications that uses patches as property to feed internal instance in imperative way. But if it will become popular enough than you will know what approach to move into not recommended list.

If you think that today this pattern is not important than issue can be closed, ok.