Skip to content

Enabling SSR

Astro AWS adapter supports three modes for server-side rendering:

  • SSR: Standard server-side rendering using AWS Lambda
  • SSR Streaming: Server-side rendering with streaming support for improved performance
  • Edge: Server-side rendering using AWS Lambda@Edge for lower latency

Regular SSR mode uses AWS Lambda to render your Astro pages on the server. This is the default mode and provides a good balance between performance and functionality.

Update your astro.config.ts file to enable SSR mode:

astro.config.ts
import { defineConfig } from "astro/config"
import astroAws from "@astro-aws/adapter"
export default defineConfig({
output: "server",
adapter: astroAws({
mode: "ssr",
}),
})
  • You need full access to AWS Lambda features (environment variables, longer execution times, etc.)
  • Your application requires access to AWS services or resources
  • You need more control over Lambda configuration
  • Your pages don’t require streaming capabilities
  • ✅ Full AWS Lambda support
  • ✅ Environment variables support
  • ✅ Access to AWS SDK and services
  • ✅ Configurable Lambda timeout and memory
  • ✅ Standard SSR rendering

SSR Streaming mode enables streaming responses, allowing your pages to start rendering content to users before the entire page is complete. This can significantly improve perceived performance, especially for pages with slow data fetching.

Update your astro.config.ts file to enable SSR streaming mode:

astro.config.ts
import { defineConfig } from "astro/config"
import astroAws from "@astro-aws/adapter"
export default defineConfig({
output: "server",
adapter: astroAws({
mode: "ssr-stream",
}),
})
  • You have pages with slow data fetching operations
  • You want to improve Time to First Byte (TTFB) metrics
  • Your pages can benefit from progressive rendering
  • You want to provide a better user experience with faster perceived load times
  • ✅ All features of regular SSR mode
  • ✅ Streaming response support
  • ✅ Progressive page rendering
  • ✅ Improved perceived performance

In your Astro pages, you can use streaming to render content progressively:

pages/products.astro
---
const products = await fetchProducts() // Slow API call
---
<html>
<head>
<title>Products</title>
</head>
<body>
<h1>Products</h1>
<!-- Content streams as it becomes available -->
{products.map(product => (
<div>{product.name}</div>
))}
</body>
</html>

Edge mode uses AWS Lambda@Edge to run your Astro application at CloudFront edge locations, providing the lowest possible latency by executing code closer to your users.

IMPORTANT: Environment variables are not supported in edge mode due to limitations of AWS Lambda@Edge.

Update your astro.config.ts file to enable edge mode:

astro.config.ts
import { defineConfig } from "astro/config"
import astroAws from "@astro-aws/adapter"
export default defineConfig({
output: "server",
adapter: astroAws({
mode: "edge",
}),
})
  • You need the lowest possible latency
  • Your application doesn’t require environment variables
  • You want to reduce cold start times
  • Your application logic is compatible with Lambda@Edge constraints
  • ❌ Environment variables are not supported
  • ⚠️ Limited execution time (5 seconds for viewer request/response, 30 seconds for origin request/response)
  • ⚠️ Smaller deployment package size limits
  • ⚠️ Limited access to AWS services (no VPC access)
  • ⚠️ No access to the file system (except /tmp)
  • ✅ Lowest latency (runs at edge locations)
  • ✅ Reduced cold start times
  • ✅ Automatic global distribution
  • ✅ Standard SSR rendering
FeatureSSRSSR StreamingEdge
LatencyStandardStandardLowest
Environment Variables
Streaming
AWS Services AccessLimited
Execution TimeUp to 15 minUp to 15 min5-30 sec
Cold StartStandardStandardFaster
Deployment SizeStandardStandardLimited