Astro
MDX
MDX is Markdown that can import and use components. In Astro it lets an author drop an interactive or styled piece into prose.
How it is measured
Add the MDX integration and name files .mdx. Import components at the top, then use them like tags in the text. Astro renders it as part of the page, and the component can be an island if it carries a client directive.
Verify by viewing the built HTML. A static component becomes markup. A component with a directive becomes an island with a script, and you can see its size in the network panel.
Worked example
A pricing explainer uses a CostSlider component in the middle of 1,800 words. The post is MDX with an import and a single tag. The slider is 7 KB with client:visible and loads when the reader reaches it.
A second author copies the post, deletes the import, and leaves the tag. The build fails with an unknown component error before it can go live.
How it differs
MDX is a file format that mixes prose with components. Content collections are the system that validates and queries files like it. MDX excludes schemas and queries; collections exclude the component syntax.
Common errors
Using MDX for plain posts that need no components. Forgetting the client directive on an interactive component. Writing JSX comments in the wrong form. Importing heavy libraries in each post. Mixing Markdown and HTML so tables break.
In practice
Use plain Markdown by default and move to MDX only for a post that needs a component. Keep a small shared set of components for authors. Preview each MDX post before merge.