MobX — это автономная библиотека, для управления фронтенд-состоянием приложения.

MobX обеспечивает консистентность и согласованность внутреннего состояния фронтенд-приложения, предоставляя удобные инструменты для его изменения.

Упрощенно, MobX позволяет реализовать цепочку: «Выполнение действия»«Изменение состояния» → «Изменение представления». При этом изменения происходят атомарно и автоматически — в результате гарантируется, что не будет момента, когда состояние будет неконсистентным.

Мы используем MobX не изолировано, а в сочетании с другими библиотеками:

  • MobX State Tree — расширение для MobX, которое позволяет работать с состоянием приложения ещё удобнее. 
  • React в сочетании с MobX позволяет добиться постоянного соответствия внутреннего состояния с визуальным представлением интерфейса.

MobX + MobX State Tree + React — это отличная связка для разработки интерактивных интерфейсов. 

MobX State Tree расширение для MobX, его основной особенностью является эффективная работа с транзакционными изменениями состояний и со снимками данных.

Сочетает в себе простоту и легкость изменения данных с отслеживаемостью неизменяемых данных, а также реактивность и производительность в получении всех хранимых данных. Благодаря MST можно более гибко управлять состоянием приложения.

Узнать больше →

React — это JavaScript-библиотека для создания интерактивных пользовательских интерфейсов.

React декларативный и поэтому достаточно описать визуализацию частей интерфейса приложения в разных состояниях, а библиотека уже сама будет при изменении внутреннего состояния приложения автоматически и своевременно обновлять интерфейс. Компонентная структура React упрощает разработку сложных интерфейсов.

Узнать больше →

Тематические технологии:

Библиотека React
Библиотека MobX State Tree
Язык программирования JavaScript
Система сборки WebPack
Платформа NodeJS
Yarn
NPM
jQuery

Cтатьи по теме:

Язык разметки HTML, таблицы стилей CSS и язык JavaScript
Содержание и внешний вид каждой страницы сайта определяется HTML-кодом и содержанием таблицы стилей CSS, а поведение интерфейса — скриптами JavaScript.
Увеличиваем скорость работы сайта при помощи оптимизации JavaScript
Сайт может работать быстрее, если выполнены следующие рекомендации по оптимизации JS-кода. Если же этого не сделать, то сайт будет недостаточно быстро отображаться на стороне клиента.
Чек-лист проверки фронтенда
По данному списку можно проверить фронтенд сайта или веб-приложения для выявления и последующего исправления ошибок или недочётов.
Ajax-навигация Turboliks & Wiselinks
Увеличить отзывчивость интерфейса и снизить нагрузку на сервер можно при помощи Ajax-навигации: если не перезагружать страницу целиком, а обновлять только содержание или отдельные фрагменты, то скорость работы сайта или приложения существенно возрастёт.
History API и HASH-навигация на Ajax-сайтах
Загрузка контента при помощи Ajax и навигация, построенная на этой схеме, позволяют значительно повысить отзывчивость интерфейса разрабатываемого сайта или веб-приложения. Однако такой подход заставляет решать проблемы, связанные с отображением адреса в браузере.
Ленивая загрузка или загрузка по требованию на клиентской части
Бывает так, что некоторое содержание страницы нужно не всем или не всегда, но на генерацию этого материала или для его передачи тратится много ресурсов. В этом случае имеет смысл сделать загрузку «ленивой», то есть не генерировать и не загружать в браузер информацию до тех пор, пока она не понадобится.
Валидность и семантичность HTML
Валидность и семантичность HTML кода определяет качество сайта с точки зрения поисковых систем.