Normal view

Как мы победили рутину: строим spec-driven платформу для генерации email

410 вариантов писем, сотня микросервисов и до 15 файлов, которые приходилось править ради одной нотификации. Добавление письма превратилось в квест: создай компонент, подключи, опиши параметры, зарегистрируй — и молись, что ничего не забыл.

Мы устали и автоматизировали это. Теперь описываем контракт письма в OpenAPI, а CLI генерирует весь boilerplate — от NestJS-артефактов до React-компонента с типизированными пропсами. Часы работы сжались до минут.

Меня зовут Денис, я фронтенд-разработчик в ЮMoney. В этой статье расскажу, почему мы пришли к кодогенерации, как устроили процесс и что в нём изменилось для разработчиков, дизайнеров и тестировщиков. Материал будет полезен тем, кто работает с React, NestJS или TypeScript и хочет перестать писать однотипный код вручную. Особенно если поддержка UI-компонентов и API-слоя отнимает время, которое лучше потратить на реальную логику.

Читать далее

React Fiber: как React научился прерывать рендер и расставлять приоритеты

Банальный пример — когда печатаешь в input, а интерфейс начинает лагать на большом списке: классическая боль старого React. Я решил разобраться, как и почему React переписал свою архитектуру: отказался от рекурсивного обхода дерева, изобрел новую структуру данных и научился прерывать рендер ради нашего ввода.

В статье рассмотрю проблемы синхронной отрисовки и переход к новой архитектуре,  почему пришлось отказаться от методов жизненного цикла с приставкой *will, что такое Fiber, почему первый вариант приоритизации с ExpirationTime не сработал и как пришли к React Lanes.

Читать далее

Быстродействие, или Смотря как измерять

Один и тот же JavaScript-код в браузере, Node.js, Deno и Bun должен показывать примерно одинаковую скорость – по крайней мере, так кажется до первых замеров. Я взял четыре прикладные задачи, добавил к сравнению Python и измерил не только время выполнения, но и потребление памяти, причём отдельно посмотрел, как результат меняется вместе с границами замера. Оказалось, что у каждой среды своё представление о быстродействии, а лидер зависит не только от алгоритма, но и от того, входят ли в задачу чтение файлов, парсинг или обработка изображений. Все примеры и исходные данные можно запустить локально и сравнить результаты со своей машиной.

Читать далее

Пишем свой React: Fiber, хуки и рендеринг под капотом

Каждый день мы пишем JSX, используем хуки и стараемся не нарушать их строгие правила. Но как вся эта «магия» работает под капотом? Почему условный рендер ломает useState, а индексы массива в key приводят к багам? Зачем React перешел на архитектуру Fiber и как алгоритм обходит дерево элементов, не блокируя браузер?

Чтобы перестать воспринимать React как черный ящик, лучший способ — написать его с нуля.

В этой статье мы шаг за шагом воссоздадим собственный движок React. Мы реализуем функцию createElement, разберем Fiber-архитектуру с асинхронным рендерингом, напишем алгоритм Reconciliation и создадим систему хуков, разобравшись в логике их работы.

Читать далее

Yet Another English — и да, ещё один сайт по изучению английского, ну че поделать?

Ну как вы поняли, сервис я так и назвала, чтоб сразу закрыть основное возражение (хихик). Да знаю, что их тысячи — и сделала еще один, и объясню дальше почему.

У меня средненький английский, примерно B1 (но для менеджерки продукта требуется обычно по‑больше левел ю ноу). Я смотрю YouTube на англ, чтобы его подятнуть и постоянно натыкаюсь на незнакомые слова. В табличку выписывать, в анки загружать — мне было лень. Хотелось так: кинула ссылку на видео — слова моего уровня сами вытащились из субтитров и встали в очередь на повторение.

Работаю много, по вечерам есть 1–2 часика обычно. Вот за пару месяцев таких вечеров (595 коммитов) получился тренажёр: pwa на реакте, данные живут в IndexedDB у пользователя, + словарик + разные упражнения.

От «сайта эпохи ИИ» ждёшь, что внутри обёртка над чат‑ботом, РАГИ, и все такое ну вы поняли. У меня вышло наоборот: LLM здесь — подрядчик на двух узких задачах, а основную работу делают частотные списки, алгоритм из 90-х ну и клод в качестве работяги. Собсна про это и будет статья, или серия статей.

Читать далее

Калькулятор плитки научился ёлочке и плану всей квартиры — что поменялось за месяц

Прошлый раз я рассказал, как написал свой калькулятор раскладки плитки, потому что замучился считать ванную в столбик. Тот пост был про версию 1.2 — база, прямая/диагональная раскладка, смета, PDF, нумерация плиток. Комменты были классные, фидбек пошёл сразу, и за месяц я выкатил ещё три версии. Самое заметное — ёлочка и общий план квартиры, где все комнаты лежат на одном полотне. Про это и пишу.

Читать далее
❌