Skip to content

Commit 6b712e5

Browse files
committed
- README.md update
1 parent 5ecdbc2 commit 6b712e5

File tree

1 file changed

+6
-1
lines changed

1 file changed

+6
-1
lines changed

README.md

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ Built by [@RIP21](https://twitter.com/rip212) 👨‍💻
3737
- [breaking] `easymde` now a peer dependency, please install it manually
3838
- [breaking] `label` prop has been removed
3939
- [breaking] SSR safe nets removed, please make sure to import it dynamically
40+
- [breaking] `options` shall be memoized to prevent new instances from being created on each render and other related to that bugs (more on that below)
4041
- [potentially-breaking] Forwards `ref`, so you can easily get access to `div` wrapper by using `ref` prop.
4142
- [potentially-breaking] Lots of bugs fixed, examples updated
4243
- [potentially-breaking] `@babel/runtime` helpers are no longer inlined but imported.
@@ -100,8 +101,12 @@ If you're using TypeScript it will be inferred by compiler.
100101

101102
Note: if you don't specify a custom id it will automatically generate an id for you.
102103

103-
Note that you need to `useMemo` to memoize `options` so they do not change on each rerender! It shouldn't affect behavior, but it may affect performance
104+
Note that you need to `useMemo` to memoize `options` so they do not change on each rerender! It will affect behavior and performance
104105
because then on each render of the parent that renders `SimpleMdeReact` you'll get a new instance of the editor, which you definitely want to avoid!
106+
Also, if you change `options` on each `value` change you will lose focus.
107+
So, put `options` as a `const` outside of the component, or if `options` shall be partially or fully set by `props` make sure to `useMemo` in
108+
case of functional/hooks components, or class field for `class` based components.
109+
Slightly more on that here: [#164](https://github.com/RIP21/react-simplemde-editor/issues/164)
105110

106111
```tsx
107112
export const UsingOptions = () => {

0 commit comments

Comments
 (0)