Козуля рассказывал про фронтэнд Финама.
Стек
Очень core-части пишутся на Java, гоняются в GWT и closure compiler. Потому что кроссплатформенность. Protobuf, TypeScript.
Архитектура
Разбито по модулям: ПАПКА (господи, я же просил) со всем, что относится к модулю (иконки, хелперы, etc).
Сначала пытались класть по src/{components, reducers, actions}
, но решили группировать по модулям src/{module}/{reducers|components|actions|helpers}
.
Логично — так намного удобнее работать, сам в какой-то момент пришёл к этому.
Нейминг
Сначала было Form
, потом SuperFormOfSubmitUserData
, но затем из-за модульной архитектуры (см. выше) откатились к Form
— когда импортишь форму из какого-то модуля, всё и так семантично становится.
Про архитектуру, pt. 2
В проекте есть куча мапперов, куча форматтеров, коннекторов. Всё в модулях.
Маппер: функция преобразующая одну структуру в другую
Форматтер: форматирует значение по правилам
Коннекторы: HoC, в который пробрасываются данные с сервера. Абстрагирует работу с сервером от рендера
Датафлоу
Источник данных → коннектор → маппер → форматтер → интерфейс. Из интерфейса данные отправляются в источник данных через редакс.
Способы оптимизации рендера
Самые тупые: sCU, PureComponent
Поумнее: recompose, reselect
Если не помогло: выпилить Редакс
Если и это не помогло: выпилить Реакт
Переходите на ХТМЛ! Мораль: Редакс или Реакт не всегда нужны для каких-то вещей, иногда можно тултип сделать через атрибут title
.
В Редаксе хранят данные, которые отправят в локалсторейдж, чисто данные. Интерфейсные вещи хранятся в локальном стейте (открыто/закрыто меню, показан тултип, etc).
Лайфсайкл вывода продукта
Выходят много спецпроектов, много релизов, поэтому есть четкий флоу.
1. прототип — create-react-app, все компоненты в одной куче, плюс material-ui
2. релиз — вставляют редакс потому что нужно систематизировать (минутка рекламы: редакс )
3. рефакторинг — бьют на модули, разбивают на подкомпоненты, етц
4. оптимизация — кладут по пакетам бизнес-логику, помогает jFrog Artifactory, самое сложное — ридми и ченджлог
В итоге когда всё в пакетах, то разработка продукта превращается в конфигурацию и шаблон.