# vagejs 0.11: interactive React components

> vagejs 0.11 lets a React component run in the browser with client:load, client:visible or client:idle, while every other page still sends no JavaScript.

vagejs 0.11 lets a React component run in the browser when you mark it with `client:load`, `client:visible` or `client:idle`. Every other page still sends no JavaScript. Update with `npm install vagejs@latest`.

26 October 2026 · 1 min read · by [Venkatesh A G E](#author)

## What changed?

In [0.10](https://vagejs.com/blog/vagejs-0-10-languages-react-vue-mdx/), React components became plain HTML at build time. In 0.11, you can also make one interactive, in an MDX page or a React layout:

```
<PriceCalculator client:visible pricePerSeat={12} />
```

The component is still turned into HTML first, so visitors see it straight away, and then it starts working in the browser: when the page loads, when it scrolls into view, or when the browser is idle.

## Why does it matter?

Most of a content site never changes after it loads, but some parts need to react to a visitor: a price calculator, a filter, a small form. Before 0.11 that meant writing your own script. Now it's one word on a component, and only the pages that use one load JavaScript.

That JavaScript isn't hidden from you. Each page with an interactive component loads React, about 215 KB, and `vage audit` counts it against your JavaScript budget. `vage check` explains, by name, anything it can't turn into a working component.

## Where to go next

-   Build a working price calculator: [add an interactive React component to a static site](https://vagejs.com/guides/interactive-react-component-static-site/)
-   What components can and can't do: [React, Vue and MDX](https://vagejs.com/features/react-vue-mdx/)
-   Every rule: [interactive components docs](https://vagejs.com/docs/components/#interactive-components)

Interactive components are React only for now. Vue components work in layouts, as HTML. The full list of changes is in the [changelog](https://vagejs.com/changelog/).

![](https://vagejs.com/images/venkatesh-age-144.webp)

Written by

Venkatesh A G E

Web developer in Bengaluru, India, and the maker of vagejs. Helps startups turn their websites into a real source of customers, with a focus on clarity, technical SEO and AI search.

[LinkedIn](https://www.linkedin.com/in/ageven/)[About](https://vagejs.com/about/)
