Radix Primitives offers a lightweight select, but tree-shaking is critical

Headless UI libraries can add significant page weight. We analyze Radix Primitives' Select component, a potential solution for performance-focused developers who find libraries like Ark UI and Base UI too heavy.

THE ANSWER UP FRONT

For developers building custom UIs in frameworks like Astro where bundle size is a primary concern, Radix Primitives is the correct choice for a headless select component. Its granular, tree-shakeable architecture ensures you only ship the code you use, directly addressing the 100kB+ bloat reported with other libraries. You should skip Radix if you need a fully-styled, out-of-the-box component and lack the resources to build your own design system. The bottom line: Radix delivers on its lightweight promise, but you have to do the work to keep it that way.

METHODOLOGY

This v0 review analyzes Radix Primitives, specifically the @radix-ui/react-select package, as of June 2026. The analysis is prompted by a developer's request on Reddit for lightweight alternatives to Ark UI and Base UI for an Astro and Preact project. The source signal is available at https://www.reddit.com/r/webdev/comments/1ueljxe/are_there_any_good_lightweight_headless_select/.

This review covers Radix's architecture, its approach to bundle size, and its suitability for the use case described. We reference public bundle size information from third-party analyzers like Bundlephobia to substantiate claims. What is not covered is an independent, reproducible benchmark comparing the final bundle sizes of identical applications built with Radix, Ark UI, and Base UI. A full performance analysis, including Core Web Vitals, is also outside the scope of this initial review. This v0 review draws on the user's reported experience and public documentation; independent benchmarks are pending.

WHAT IT DOES

Radix Primitives provides a set of low-level, unstyled, and accessible UI components for React applications. It operates on the principle of giving developers full control over styling and logic, providing only the essential behaviors.

Headless, unstyled primitives

Unlike component libraries like Material UI, Radix components ship with zero styles. They are "headless," meaning they manage state, interactions (keyboard navigation, focus management), and accessibility attributes, but leave the visual presentation entirely to the developer. For a select component, Radix provides the necessary parts (Root, Trigger, Portal, Content, Item) which you compose and style yourself using CSS, CSS-in-JS, or utility-class frameworks like Tailwind CSS.

Granular and tree-shakeable

The library is published as a collection of small, independent npm packages. If you only need a select component, you install @radix-ui/react-select and your bundler will only include the code for that specific component and its direct dependencies. This is in contrast to libraries that may require a larger core or context provider, contributing to the page weight issues described in the source signal.

Focus on accessibility

Radix components are built following WAI-ARIA design patterns. This means they come with correct role, aria-*, and data-* attributes out of the box. It also handles complex keyboard interactions, such as opening the select with arrow keys, typing to search for an option, and closing with Escape, which are difficult and error-prone to implement manually.

WHAT'S INTERESTING / WHAT'S NOT

The most interesting aspect of Radix is its verifiable impact on bundle size. The developer in the signal reported Ark UI and Base UI adding around 100kB to their page. Public data from Bundlephobia shows @radix-ui/react-select at approximately 13.5kB minified and gzipped. This is a nearly 90% reduction and aligns with Radix's core value proposition. The architecture forces a "pay for what you use" model, which is the correct approach for performance-critical applications.

The trade-off, which is what's "not interesting" or rather, the primary cost, is developer effort. Radix is not a drag-and-drop solution. You are responsible for every CSS property. This can be a significant undertaking for teams without a dedicated design system or frontend specialists. The rise of tools like Shadcn/UI, which are essentially pre-styled, copy-and-pasteable recipes using Radix Primitives, validates this pain point. They offer a middle ground by providing the styling layer on top of Radix's robust, accessible foundation.

For the developer in the signal, who is already working within Astro's islands architecture and is sensitive to every kilobyte, the Radix trade-off is almost certainly the right one. The cost of styling is paid once, while the performance benefit is delivered to every user on every page load.

PRICING

Radix Primitives is an open-source project released under the MIT License. It is free for personal and commercial use.

(Pricing snapshot: June 25, 2026)

VERDICT

Radix Primitives is the best-in-class solution for developers who need to build custom, high-performance, and accessible UI components from scratch. For the specific problem of finding a lightweight select component for an Astro site, it is the clear recommendation over heavier alternatives. Its granular package design and commitment to being unstyled provide the necessary escape hatch from the bundle size bloat common in other UI libraries. If you are a team that values performance above out-of-the-box convenience and has the resources to handle custom styling, Radix is the correct foundation for your component system.

WHAT WE'D TEST NEXT

For a v2 review, we would build a minimal, reproducible test case using Astro and Preact. We would create three identical pages, each using a select component from Radix, Ark UI, and Base UI respectively. The primary goal would be to verify the final JavaScript bundle size for each island, confirming or refuting the 100kB figure from the source signal. We would also measure the impact on Core Web Vitals, specifically Total Blocking Time (TBT), to quantify the real-world performance difference. Finally, we would assess the developer experience of styling each component to match a simple design specification.

The investor read

This signal highlights the persistent tension between developer experience and performant user experience. The market is rewarding unopinionated, 'bring your own styles' primitives like Radix and Headless UI, indicating a fatigue with monolithic, all-in-one component libraries. This creates a 'picks and shovels' opportunity for companies building foundational tooling. The subsequent rise of meta-frameworks like Shadcn/UI, which are essentially styling recipes on top of Radix, shows where the next layer of value is being created. These are not component libraries themselves but opinionated implementations. This suggests the market is bifurcating: low-level, unstyled primitives and high-level, copy-pasteable patterns, hollowing out the middle. An investment in a primitives library is a long-term OSS play; the more immediate opportunity may be in the tooling and services that build upon them.

Pull quote: “Radix delivers on its lightweight promise, but you have to do the work to keep it that way.”