Ответ вслух Middle Feature-Sliced Design обновлено

Что такое Feature-Sliced Design

Вопрос

Что такое FSD и какую задачу он решает? Две минуты, как коллеге, который знает React, но про FSD не слышал.

Попробуйте сами

Ответьте вслух за 2 минуты, как на собесе. Потом сверьтесь с тезисами: что прозвучало, а что нет.

Показать ответ и разбор

Коротко

FSD - соглашение о том, где лежит код, чтобы зависимости шли в одну сторону. Три измерения.

Что должно прозвучать в ответе

  • это методология структуры фронтенд-проекта, а не библиотека и не фреймворк

  • решает проблему папок components/utils/helpers, которые растут без правил

  • делит код на слои, слайсы и сегменты

  • главное правило - односторонние зависимости: слой видит только слои ниже

  • каждый слайс наружу отдаёт публичный API, а не внутренности

  • выигрыш измеримый: фичу можно удалить целиком, не выковыривая её из десяти мест

Что могут спросить следом

  • А как FSD дружит с Next.js и его файловым роутингом?
  • Что делать с общими типами, которые нужны везде?

Разбор

FSD - соглашение о том, где лежит код, чтобы зависимости шли в одну сторону.

Три измерения. Слои (app, pages, widgets, features, entities, shared) - вертикаль ответственности. Слайсы внутри слоя - деление по предметной области (user, order, cart). Сегменты внутри слайса - по технической роли (ui, model, api, lib, config).

Главное правило одно: модуль может импортировать только то, что лежит ниже по слоям, и не может импортировать соседний слайс своего слоя. Из-за этого граф зависимостей остаётся ацикличным, а любую фичу можно вырезать целиком.

Что лечит. Классическая структура components/ utils/ helpers/ api/ не запрещает ничего: через полгода utils/format.ts знает про корзину, а компонент кнопки - про роутинг. FSD делает такие связи невозможными на уровне правила, а не договорённости.

Чего не делает. Не ускоряет разработку и не улучшает код сам по себе. Это инвестиция в изменяемость: она окупается на проекте, который живёт годами и который правят несколько человек.

Частые ошибки

  • Пересказ списка папок без правила зависимостей - это и есть суть, а не папки.

Ответьте сами, а не прочитайте

В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.

Термины по теме