В традиционной парадигме контроллера представления модели (mvc) приложение разделено на три папки: состояние (модель), пользовательский интерфейс (представление) и контроллер (как взаимодействия в состоянии изменения представления). Вместо разделения логики для каждого компонента в три разных места, React разбивает приложение на множество компонентов (функциональных блоков) и размещает всю логику для каждого компонента в одном месте. Когда разработчик вносит изменения, он в основном занимается изменением определенного функционального блока и поэтому хочет, чтобы вся эта логика для этого компонента была в одном месте.
Помимо реструктуризации приложения, React упрощает модель mvc. Функция рендеринга в каждом компоненте кодирует, как представление должно выглядеть в зависимости от состояния. React также позволяет добавлять другие функции, такие как обработчики событий, влияющие на состояние. Всякий раз, когда состояние изменяется, React автоматически отображает компонент на основе нового состояния. Кроме того, он автоматически вносит минимальные изменения в DOM для перехода от старого представления к новому представлению.В традиционном mvc для каждой возможной комбинации старого/нового состояния разработчик должен выяснить, как должно измениться представление. . В React разработчик определяет одну функцию для того, как представление зависит от текущего состояния, и ему нужно только определить функции для того, что может изменить состояние. Разработчику не нужно беспокоиться о том, каким было предыдущее состояние и как это изменение состояний влияет на представление.
В заключение, структура React, основанная на функциональных компонентах, удобна для разработчиков. Во-вторых, React позволяет разработчикам просто сосредоточиться на том, как представление зависит от состояния и какие события могут изменить это состояние.
