When should I use observer in mobx-react?

Question

I'm doing on migration all of my class component to functional component using mobx-react

I wonder all of my components should wrapped by observer or not.

I guess there might be three scenarios.

1. observable states are being called and used.
2. observable states are been passed into props
3. purely stateless component.

let's say all of three components above are functional component.

Should I wrap all the components above with observer of mobx-react?

cf) Is there any articles or benchmarking compares to @observer decorators of mobx ?

Answer 1

Basically this https://mobx.js.org/react-integration.html#always-read-observables-inside-observer-components

You usually wrap everything in observer, exception might be components which only render primitives or something like this, but it is tedious to track it so usually you just wrap all of them.