Astro Documentation
Modified 2022-10-07
Getting Started
Installation
Integrations
Deployments
Core Concepts
Why Astro?
- Content-focused: Astro was designed for content-rich websites.
- Server-first: Websites run faster when they render HTML on the server.
- Fast by default: It should be impossible to build a slow website in Astro.
- Easy to use: You don’t need to be an expert to build something with Astro.
- Fully-featured, but flexible: Over 100+ Astro integrations to choose from.
Astro Islands
The term “Astro Island” refers to an interactive UI component on an otherwise static page of HTML. Multiple islands can exist on a page, and an island always renders in isolation. Think of them as islands in a sea of static, non-interactive HTML.
The most obvious benefit to building with Astro Islands is performance: the majority of your website is converted to fast, static HTML and JavaScript is only loaded for the individual components that need it. JavaScript is one of the slowest assets that you can load per-byte, so every byte counts.
---
// Example: Use a dynamic React component on the page.
import MyReactComponent from '../components/MyReactComponent.jsx';
---
<!-- This component is now interactive on the page!
The rest of your website remains static and zero JS. -->
<MyReactComponent client:load />
Basics
Guides
Integrations
Tailwind
Sitemap
Image Optimizations
Internationalization
Icons
Partytown (for analytics)
SEO
Metadata
- Creator(s)
Fred K. Schott