Olddevs UI3.38.0
Справочник

Сколько стоит импорт

Пакет ships source и вытряхивается деревотряской: в бандл потребителя уезжает только то, что он импортировал. Замер на 3.30.1 — вклад самого пакета, peer-зависимости внешние, метрика gzip:

Что импортирует потребительgzip
cn и tableStateToParams0,6 кБ
одна Button1,6 кБ
DataTable8,5 кБ
весь кит целиком (import *)63,2 кБ
RichTextEditor из @olddevs/ui/editor, без движка, «старт»62,7 кБ
RichTextEditor вместе с движком Tiptap, «старт» (статический граф, basic)287,8 кБ
RichTextEditor вместе с движком Tiptap, «полный» (со всеми ленивыми чанками, full)329,0 кБ
RichTextView из @olddevs/ui/editor, движок Tiptap в замер включён11,6 кБ
sanitizeRichText и richTextSanitizeConfig из @olddevs/ui/editor/schema, движок Tiptap в замер включён3,6 кБ
highlightCodeBlocks из @olddevs/ui/editor/highlight, вместе с lowlight22,6 кБ
highlightCodeNodes из @olddevs/ui/editor/highlight, вместе с lowlight22,6 кБ

Семь последних строк — отдельные входы редактора со своими бюджетами (ADR-0050). У Редактора три строки, и две из них — сценарии (ADR-0058, п. 11.7): «старт» — статический граф, то, что едет сразу и что платит пресет basic; «полный» — он же плюс все ленивые чанки подпути, то, что в итоге грузит full. Блок кода и таблица (их нет в basic, а их часть для движка тяжелее 10 кБ) грузятся лениво, до их прихода Редактор с ними показывает Скелет; npm run size проверяет, что их модулей в «старте» нет. Код кита меряется на «старте». В сценариях движок внесён в замер намеренно: Tiptap — опциональная peer-зависимость, но набор его расширений выбирает кит; с подсветкой блока кода туда же входят lowlight и восемь грамматик highlight.js (ADR-0051). Число снято тем же конвейером, что и остальные (vite в режиме библиотеки, где пробелы при минификации остаются); бандлер приложения с полной минификацией давал около 133 кБ (замер OLDSUI-40, до Панели). У RichTextView Tiptap и lowlight внесены в замер ради проверки: 10,1 кБ — это типографика и остров кнопки «Копировать» у блоков кода (кнопка и подсказка кита, каталог сообщений; без острова было 1,7 кБ) — и они доказывают, что в его графе нет ни движка, ни подсветчика; так же меряется лёгкий вход @olddevs/ui/editor/schema (3,6 кБ — Схема, richTextSchema, очистка sanitizeRichText с хуками для DOMPurify, в том числе по правилам своих Инструментов, и markRange). Серверная подсветка @olddevs/ui/editor/highlight (22,6 кБ — почти целиком ядро highlight.js и грамматики) стоит только тому, кто её импортировал, и обычно — только на сервере; хелпер highlightCodeNodes для CodeView весит столько же — React в замер не входит, он peer кита (ADR-0052). Кто вход @olddevs/ui/editor не импортирует, не платит ни за движок, ни за код Редактора; в основной вход попадают только английские подписи Редактора в общем каталоге сообщений — около 1 кБ gzip (ADR-0050, п. 5). Поповер своего цвета в Редакторе (ColorPicker и цветовая подсистема react-aria-components, около 51 кБ gzip) грузится лениво при первом «Свой цвет…»: в «старт» он не входит, а в «полный» — только кодом кита, react-aria — peer-зависимость. Ленивые чанки скрипт не отбрасывает молча: их вес сверх «старта» он печатает у каждой строки. Чанки можно подгрузить заранее — modulepreload на них ставит потребитель.

Числа сторожатся в CI и сверяются с этой таблицей: npm run size меряет вклад пакета и падает, если документация разошлась с замером, а npm run check:consumer меряет First Load JS страницы приложения-потребителя. Бюджеты обеих величин лежат в scripts/bundle-size.budgets.mjs.

Если компонент вырос по делу, бюджет поднимается — отдельной строкой в merge request и с объяснением, что именно выросло. Бюджет, который двигают заодно с правкой компонента, перестаёт что-либо сторожить уже через пару релизов.

Что лежит в пакете

Разбор решения — ADR-0042.

Кроме dist и styles.css публикуются исходники (src, без историй) и карты к ним. На бандл потребителя это не влияет ни на байт: в браузер уезжает только импортированный код из dist, а исходники и карты нужны инструментам — отладчику и редактору. Цена — вес установки: 2,4 МБ распакованным против 1,4 МБ без исходников.

Покупается на них рабочая отладка. Без src карты в пакете лежали мёртвым грузом: они ссылаются на исходник относительным путём, файла рядом не было, и отладчик молча показывал скомпилированный код. Теперь брейкпоинт внутри кита открывает настоящий .tsx — с комментариями, в которых объяснено, почему компонент устроен именно так, — а «перейти к определению» ведёт туда же, а не в .d.ts.

Публичный вход это не расширяет: exports — закрытая карта, и import "@olddevs/ui/src/components/Link.tsx" Node и любой уважающий exports бандлер отвергают с ERR_PACKAGE_PATH_NOT_EXPORTED. Исходники в пакете — материал для инструментов, а не второй способ импортировать кит.

С 3.8.0 рядом с ними едет справочник — docs/ целиком и указатель llms.txt в корне пакета (ADR-0044). Тот же обмен, что и с исходниками: в браузер не уезжает ни байта, вес установки растёт с 2,5 до 3,1 МБ. Смысл — в читателе: комментарий в коде объясняет, почему компонент устроен так, а страница справочника отвечает, что брать и когда, и до 3.8.0 второго вопроса в пакете не существовало вовсе.

Открывать их надо прямо из node_modules/@olddevs/ui/: начните с llms.txt — это указатель на все 87 страниц, — дальше по ссылкам. Импортировать их, как и исходники, нельзя: import "@olddevs/ui/docs/index.md" отвергается тем же ERR_PACKAGE_PATH_NOT_EXPORTED.

На этой странице