Как работает MobX

MobX — это библиотека для управления состоянием, которая использует реактивное программирование. Она автоматически отслеживает изменения данных и обновляет компоненты, которые их используют.

Основные концепции:

1. Observable — данные, за изменениями которых следит MobX.
2. Action — функции, изменяющие состояние.
3. Computed — производные значения, пересчитываемые автоматически при изменении зависимостей.
4. Reaction (например, autorun, reaction) — побочные эффекты, выполняемые при изменении состояния.

Пример:

import { observable, action, computed, autorun } from 'mobx';

class Store {
  @observable count = 0;

  @action increment() {
    this.count++;
  }

  @computed get doubleCount() {
    return this.count * 2;
  }
}

const store = new Store();
autorun(() => console.log(store.doubleCount)); // Логирует 0, 2, 4...

store.increment(); // Выведет 2
store.increment(); // Выведет 4

Плюсы:

• Простота использования.
• Минимум boilerplate-кода.
• Высокая производительность за счёт точного отслеживания зависимостей.