# astro | Astro | Knowledge Base | Instagit The web framework for content-driven websites. ⭐️ Star to support our work! GitHub Stars: 57.3k Repository: https://github.com/withastro/astro --- ## Articles ### [Astro Static, Hybrid, and Server Output Modes: A Complete Configuration Guide](/withastro/astro/astro-static-hybrid-server-only-output-modes-differences) Explore Astro's static and server output modes. Understand their differences in build artifacts, adapter needs, and hosting architecture for optimal site performance. Configure Astro effectively. - Tags: how-to-guide - Published: 2026-03-06 ### [How to Debug Rendering and Performance Issues Using Astro's Built-In Tools](/withastro/astro/debug-rendering-performance-issues-astro-tools) Debug Astro rendering and performance issues fast with built-in tools like Vite's dev overlay, ASTRO_DEBUG, and bundle analysis. Optimize your site efficiently. - Tags: how-to-guide - Published: 2026-03-06 ### [Migrating from Other Web Frameworks to Astro: A Complete Technical Guide](/withastro/astro/migrating-from-other-web-frameworks-to-astro-considerations-steps) Learn to migrate from React Vue Svelte or Solid to Astro effortlessly. This guide covers scaffolding routing data fetching and API conversion for a smooth transition. Get started today. - Tags: migration-guide - Published: 2026-03-06 ### [How the Astro Language Server Enhances IDE Support and Type Checking](/withastro/astro/astro-language-server-ide-support-type-checking) Discover how the Astro language server boosts IDE support with real-time type checking, autocomplete, and refactoring for a better developer experience. - Tags: internals - Published: 2026-03-06 ### [Security Considerations and Best Practices for Deploying Astro Applications with SSR](/withastro/astro/astro-security-considerations-deployment-best-practices-ssr) Secure your Astro SSR applications with origin validation, CSP generation, and payload limits. Learn best practices to prevent cross-origin attacks, XSS, and DoS. - Tags: best-practices - Published: 2026-03-06 ### [How Astro Handles CSS Processing: Scoped Styles and Vite Integration](/withastro/astro/astro-css-processing-scoped-styles-vite-capabilities) Discover how Astro processes CSS with Vite integration for scoped styles. Learn about style extraction, Vite's pipeline, and global CSS compatibility. - Tags: internals - Published: 2026-03-06 ### [Strategies for Optimizing Astro Application Performance and Bundle Sizes](/withastro/astro/astro-application-performance-bundle-size-optimization-strategies) Optimize Astro application performance and bundle sizes with zero JS by default, island architecture hydration, code splitting, and asset optimization. Boost your site speed. - Tags: performance - Published: 2026-03-06 ### [How Astro Integrates Markdown and MDX with Remark and Rehype Plugins](/withastro/astro/astro-markdown-mdx-integration-remark-rehype-plugins) Unlock Markdown and MDX power in Astro. Learn how Astro uses remark and rehype plugins for custom content processing, syntax highlighting, and image optimization. Integrate seamlessly. - Tags: internals - Published: 2026-03-06 ### [How to Configure Build-Time vs. Runtime Environment Variables in Astro Projects](/withastro/astro/configure-build-time-runtime-environment-variables-astro) Learn how to configure build-time vs. runtime environment variables in Astro projects. Understand the PUBLIC_ prefix for browser-accessible variables and server-only use cases. - Tags: how-to-guide - Published: 2026-03-06 ### [Understanding the Loader System in Astro: From Static Files to Type-Safe Modules](/withastro/astro/astro-loader-system-purpose-content-data-interaction) Discover Astro's powerful loader system. Transform content files into type-safe JS modules for seamless data integration with zero runtime cost. Learn how it works. - Tags: internals - Published: 2026-03-06 ### [How to Use Astro Actions for Server-Side Data Mutations and API Endpoints](/withastro/astro/astro-actions-server-side-data-mutations-api-endpoints) Learn how to use Astro Actions for secure server-side data mutations and API endpoints. This guide explains type-safe functions and client-side invocation for robust web applications. - Tags: how-to-guide - Published: 2026-03-06 ### [Astro's Internal Build Architecture and Asset Generation Process](/withastro/astro/astro-build-process-internal-architecture-asset-generation) Uncover Astro's internal build architecture. Learn how Astro's Vite pipeline compiles components, extracts CSS, and generates hydration scripts for interactive islands into a structured dist directory. - Tags: internals - Published: 2026-03-06 ### [Astro Client-Side Component Directives: load, visible, media, idle, and only Compared](/withastro/astro/astro-client-side-directives-distinctions) Understand Astro client directives load visible media idle and only. Learn how to control framework component hydration for optimal performance and user experience in your web applications. - Tags: deep-dive - Published: 2026-03-06 ### [How Astro File-Based Routing Handles Dynamic Routes and Parameter Extraction](/withastro/astro/astro-file-based-routing-dynamic-routes-parameters) Learn how Astro file-based routing builds dynamic routes and extracts parameters using [slug].astro files and the Astro.params object for efficient URL matching and data retrieval. - Tags: how-to-guide - Published: 2026-03-06 ### [How to Create and Register a Custom Astro Integration for Extending Functionality](/withastro/astro/create-register-custom-astro-integration) Learn how to create and register a custom Astro integration. Export a factory function with name and hooks and import it in your astro.config.mjs to extend functionality. - Tags: how-to-guide - Published: 2026-03-06 ### [How Astro Integrates Vite Plugins: Build Pipeline Deep Dive and Custom Plugin Guide](/withastro/astro/astro-vite-plugins-integration-custom-plugins) Discover how Astro integrates Vite plugins for a powerful build pipeline. Learn to extend Astro with custom Vite plugins for enhanced functionality and control. - Tags: deep-dive - Published: 2026-03-06 ### [How Astro Handles Image Optimization and Responsive Image Generation: Build-Time Assets Pipeline](/withastro/astro/astro-assets-system-image-optimization-responsive-images) Discover how Astro's assets system optimizes images and generates responsive markup at build time using Vite plugins. Learn about srcset attributes and global CSS for better performance. - Tags: internals - Published: 2026-03-06 ### [Astro Deployment Adapters: How to Choose Between Node.js, Vercel, Cloudflare, and Netlify](/withastro/astro/astro-deployment-adapters-differences-use-cases) Explore Astro deployment adapters like Node.js, Vercel, Cloudflare, and Netlify. Understand their key differences and use cases to choose the best fit for your project and deploy with confidence. - Tags: deep-dive - Published: 2026-03-06 ### [How Astro's Middleware System Intercepts and Modifies Requests and Responses](/withastro/astro/astro-middleware-system-intercept-modify-requests-responses) Discover how Astro's middleware system intercepts and modifies requests and responses. Read, rewrite, or replace content within a composable pipeline for flexible request handling. - Tags: internals - Published: 2026-03-06 ### [Astro Content Collections API: Core Concepts and Best Practices for Type-Safe Content Management](/withastro/astro/astro-content-collections-api-concepts-best-practices) Master Astro content collections API for type-safe content management. Learn core concepts like defineCollection, getCollection, and best practices for efficient blogging and documentation. - Tags: best-practices - Published: 2026-03-06 ### [How Astro's Hybrid SSG/SSR Rendering Strategy Works: Build-Time vs Request-Time Rendering](/withastro/astro/astro-ssg-ssr-hybrid-rendering-strategy) Discover how Astro's hybrid SSG SSR rendering blends build-time and request-time strategies. Learn to optimize your site's performance and flexibility with Astro's powerful rendering engine. - Tags: internals - Published: 2026-03-06