MobX.js

Для управления состоянием приложения используется библиотека MobX.js (https://mobx.js.org/))

MobX добавляет возможность наблюдать за существующими структурами данных, такими как объекты, массивы и экземпляры классов. Т.е. используется концепция observer/observable.

Базовые элементы библиотеки это @observable, @computed, @action.

Пример класса с observable свойством:

class Example {
    @observable
    public id: string;
    @computed
    public get name(): string {
        return this.id + '_example';
    }
}

При использовании React, можно сделать компоненты реактивными, добавив декоратор @observer из пакета mobx-react:

@observer
class ExampleContent extends React.Component {
  render() {
    const { example } = this.props;
    return (
      <div>
        {example.id}
      </div>
    );
  }
}

@observer говорит React-компоненту реагировать на изменение данных. MobX гарантирует, что компоненты будут перерисовываться, когда это необходимо, но так же не больше, чем нужно. Для правильного реагирования компонента-наблюдателя, ему нужно передавать не внутренние свойства наблюдаемых объектов, а весь объект целиком, т.к. в первом случае будет передано лишь значения, изменение которого ни на что не повлияет.

Подробнее о работе MobX.js в документации.