Перейти к основному содержимому

Слайсы и сегменты

Слайсы

Слайсы — это второй уровень в организационной иерархии Feature-Sliced Design. Их основное назначение — группировать код по его значению для продукта, бизнеса или просто приложения.

Имена слайсов не стандартизированы, поскольку они напрямую определяются бизнес-областью вашего приложения. Например, фотогалерея может иметь слайсы photo, effects, gallery-page. Для социальной сети потребуются другие слайсы, например, post, comments, news-feed.

Слои Shared и App не содержат слайсов. Это потому, что Shared не должен содержать никакой бизнес-логики, следовательно, не имеет продуктового значения, а App должен содержать только код, касающийся всего приложения, поэтому разделение не требуется.

Нулевая сцепленность и высокая связность

Слайсы задуманы как независимые и сильно связанные группы файлов кода. Картинка ниже может помочь визуализировать такие сложные концепции как связность (cohesion) и сцепленность (coupling):

Картинка вдохновлена https://enterprisecraftsmanship.com/posts/cohesion-coupling-difference/

Идеальный слайс независим от других слайсов на своем уровне (нулевая сцепленность) и содержит бо́льшую часть кода, связанного с его основной целью (высокая связность).

Независимость слайсов обеспечивается правилом импорта для слоёв:

Модуль (файл) в слайсе может импортировать другие слайсы только если они находятся на слоях строго ниже.

Правило публичного API для слайсов

Внутри слайса код может быть организован как угодно, и это не создаст никаких проблем до тех пор, пока слайс имеет качественный публичный API. В этом суть правила публичного API для слайсов:

Каждый слайс (и сегмент на слоях, не имеющих слайсов) должен содержать определение публичного API.

Модули вне этого слайса/сегмента могут ссылаться только на публичный API, а не на внутреннюю файловую структуру этого слайса/сегмента.

Подробнее о причинах требования публичных API и лучших практиках их создания читайте в справочнике о публичных API.

Группы слайсов

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

Функции "compose", "like" и "delete" сгруппированы в папку "post". В этой папке также есть файл "some-shared-code.ts", который зачеркнут, чтобы показать, что это запрещено.

Сегменты

Сегменты — это третий и последний уровень в организационной иерархии, их цель — группировать код по его техническому назначению.

Существует несколько стандартизированных названий сегментов:

  • ui — все, что связано с отображением UI: UI-компоненты, форматтеры дат, стили и т.д.
  • api — взаимодействие с бэкендом: функции запросов, типы данных, мапперы и т.д.
  • model — модель данных: схемы, интерфейсы, хранилища и бизнес-логика.
  • lib — библиотечный код, необходимый другим модулям в этом слайсе.
  • config — конфигурационные файлы и фиче-флаги.

На странице про Слои есть примеры того, как каждый из этих сегментов может использоваться на разных слоях.

Вы также можете создавать свои собственные сегменты. Наиболее распространенные места для кастомных сегментов — это слои App и Shared, где слайсы не имеют смысла.

Убедитесь, что название этих сегментов описывает, для чего нужно его содержимое, а не чем оно является. Например, components, hooks и types — плохие названия сегментов, потому что они не так полезны, когда вы ищете код.