Контекст
Команда Radix UI запустила Base UI как «следующее поколение» headless-компонентов. Это не форк и не замена — это другой подход к той же задаче. Мы пощупали оба на трёх проектах подряд и для новых проектов остановились на Base UI.
Что общего
- Оба headless — стилей нет, только поведение и доступность
- Оба работают с любым CSS-решением: Tailwind, CSS-in-JS, vanilla
- Оба покрывают одинаковый набор примитивов: меню, диалоги, поповеры, селекты
В чём разница
API ближе к стандартам
Base UI меньше изобретает свои абстракции. Dialog.Root, Dialog.Trigger,
Dialog.Portal — но с более прямой связью с нативными элементами и ARIA.
import { Dialog } from "@base-ui-components/react/dialog";
<Dialog.Root>
<Dialog.Trigger>Открыть</Dialog.Trigger>
<Dialog.Portal>
<Dialog.Backdrop />
<Dialog.Popup>
<Dialog.Title>Заголовок</Dialog.Title>
<Dialog.Description>Описание</Dialog.Description>
</Dialog.Popup>
</Dialog.Portal>
</Dialog.Root>;Меньше weight в бандле
На наших замерах Base UI в среднем на 15-25% легче Radix для одинакового набора компонентов. Ничего революционного, но приятно.
Выше предсказуемость SSR
Radix исторически требовал ритуалов с гидрацией для popover'ов и поповер-меню.
Base UI работает с RSC из коробки, без useId плясок.
Где Radix всё ещё впереди
- Документация и примеры — у Radix их сильно больше
- Экосистема — shadcn/ui, headlessui, comb — всё это вокруг Radix
- Стабильность API — Base UI пока обновляется быстрее, чем хотелось бы
Если вам нужно стартануть быстро и взять готовый shadcn-стек — берите Radix.
Наш выбор
Для новых проектов берём Base UI. Меньше бандл, проще SSR, ближе к стандартам. Старые проекты на Radix не переписываем — это не та история, которая окупает усилия.
Итог
Это не «новое лучше старого». Это про инструмент под задачу. Если вас не пугает ранняя экосистема и хочется чище работать с RSC — Base UI оправдан.