5 причин, почему вы должны забыть о Redux в приложениях на React

Почему — я выше подробно расписал. Голый MobX вы можете сравнить, скажем, с голым Svelte, с react hooks, с knockout и пр.

Я сравниваю преимущества MobX по сравнению с flux — архитектурой (на примере Redux) в приложениях на React. Оба они по сути конкуренты — и то и другое представляется как возможность организовать хранение данных на фронте. Статья так и называется — почему вы должны использовать MobX вместо Redux. Почему я должен сравнивать MobX с Svetle, Knockout и react hooks я, честно говоря не очень понимаю.

5 причин, почему вы должны забыть о Redux в приложениях на React

А текущая статья это как 99% статей про Svelte где вам показывают 2+2 и спрашивают, а чего это вы все ещё не пишете на Svelte? :)

Вы предлагаете мне сделать аналог фейсбука, чтобы вы смогли оценить преимущества MobX?

5 причин, почему вы должны забыть о Redux в приложениях на React

Если реакт использовать для чисто серверного рендеринга где все страницы рендерится на сервере

Тогда и реакт не нужен

5 причин, почему вы должны забыть о Redux в приложениях на React

Согласен, такой подход позволяет убрать всю бизнес логику из компонентов, оставить в них только логику отображения. Тут тоже несколько плюсов:
1. Компоненты становятся меньше и соответственно более понятно, что в них происходит
2. Если в компонентах фигачить бизнес-логику, она будет пересчитываться каждый раз, когда этот компонент будет перерендериваться, а это минус к производительности
3. Компоненты становятся менее зависимыми от данных == больше шанс их переиспользовать.

5 причин, почему вы должны забыть о Redux в приложениях на React

Можно создать отдельный класс в котором будут данные и отдельный класс в котором будут методы. Лично я предпочитаю хранить и данные и методы для этих данных в одном классе:

class Users {
   @observable list = [];
   @action getUser = (id) =>{
       return this.usersList.filter(user => return {user.id == id})
   }
   @action fetchList = () => {
       return new Promise((resolve, reject) => 
                api.get('someUrl')
                    .then(res=> {
                          this.list = res.data;
                          resolve()
                     })
                   .catch(e => reject(e))
       )
   }
}

Такой подход позволяет не просто хранить данные, а создавать сущности и потом в компоненте сразу понятно, что происходит:

try {
    await Users.fetchList();
    Users.getUser(id);
} catch(e){
    console.log(e)
}