Client-Side Architecture Basics: I. Architecture (2020)

Khalil Stemmler

Данная статья представляет собой введение в основы архитектуры на стороне клиента, в которой автор рассматривает проблемы существующих подходов и предлагает пути их решения.

Проблема современных стандартов (MVC и MVP)

Большинство разработчиков знакомы с паттерном Model-View-Controller (MVC), который разделяет приложение на данные/логику (модель), представление (вид) и обработку событий (контроллер). Для клиентских приложений часто используется его производная — Model-View-Presenter (MVP), где вид создает события, которые обновляют модель, а модель, в свою очередь, обновляет вид.

Основная проблема этих паттернов заключается в том, что они слишком универсальны. В них компонент «Модель» (M) перегружен обязанностями, что создает неопределенность: разработчики часто не знают, какой инструмент за какую задачу отвечает.

Задачи «Модели» в клиентских приложениях

В современных веб-приложениях «модель» выполняет множество функций:

  • Управление состоянием: получение, обновление и реактивность данных.
  • Сетевое взаимодействие: запросы к API, обработка ответов, индикация загрузки и ошибок, а также оптимистичные обновления.
  • Поведение модели (логика):
    • Логика взаимодействия (прикладная): реакция на действия пользователя (например, валидация перед отправкой API-вызова).
    • Доменная логика: правила, не зависящие от самого приложения, а проистекающие из предметной области (например, правила хода шахматных фигур).
  • Аутентификация и авторизация: проверка прав доступа как в представлении, так и на уровне логики взаимодействия.

Необходимость общего языка

Несмотря на обилие инструментов (React hooks, Redux, Apollo Client и др.), разработчикам не хватает общего языка для описания архитектурных концепций. Наличие такого понимания позволило бы лучше проектировать приложения, четко распределять задачи между инструментами и избегать глубокого проникновения одной проблемы в другую.

Решение: уроки бэкенд-разработки

Автор отмечает, что проблемы «размытой модели» уже решались в бэкенд-разработке на протяжении последних 30 лет. Когда стандартного MVC стало недостаточно, разработчики перешли к более продвинутым архитектурам, таким как Чистая архитектура (Clean Architecture).

Ключевой принцип здесь — разделение модели на слои:

  1. Доменный слой (Domain): чистая бизнес-логика.
  2. Прикладной слой (Application): логика конкретного приложения.
  3. Инфраструктурный слой (Infrastructure) / Адаптеры: интеграция внешних зависимостей (API, базы данных, кеши), которые должны быть отделены от ядра приложения.

Цели клиентской архитектуры

Архитектура — это не просто организация файлов, а способ написания тестируемого, гибкого и поддерживаемого кода:

  • Тестируемость: Четкое разделение ответственности позволяет писать юнит-тесты для сложной логики (например, шахматных правил), в то время как простые CRUD-приложения могут ограничиваться интеграционными тестами.
  • Гибкость: Возможность легко заменять компоненты представления или изменять поведение модели (например, подменять реальный API на мок-объекты для тестов).
  • Поддерживаемость: Баланс между строгой структурой и удобством разработки (Developer Experience). Слишком жесткие правила могут снизить скорость работы, но отсутствие структуры мешает развитию приложения в долгосрочной перспективе.

Категории

Похожие статьи