[cheapsteak]

You can easily maintain the abstraction of dumb components if you wish to:

    const TodoView = ({title, isFinished, onClick}) => (
        <li>
            <input
                type="checkbox"
                checked={isFinished}
                onClick={onClick}
            />{title}
        </li>
      )

    const TodoViewContainer = observer({todo} => (
        <TodoView
          title={todo.title}
          isFinished={todo.finished}
          onClick={() => todo.finished = !todo.finished}
        />
      ))

But how often are you changing your app's data layer? Is the tradeoff _always_ worth it?

Mobx allows you to be as pragmatic or dogmatic as you choose to be

[ng12]

> But how often are you changing your app's data layer? Is the tradeoff _always_ worth it?

Yes, because in my mind that's the litmus test that your app is properly data-agnostic. And a key thing about Redux is it stays that way -- it's actually difficult to leak your data store to child components. Even if I adopt the above approach with MobX it'd be incredibly easy for some other developer to start passing around stores everywhere.

My gut feeling is that MobX would be great for a personal project but doesn't scale that well.

[gitaarik]

I've had a presentation about this a short while ago. It's easy to do both ways with MobX. You can have smart components and dump components however you want them. You have this with Redux too, but the most standard way in Redux is to use connect() and that makes components dump anyway.