How We Cut Astro Build Time from 30 Minutes to 5 Minutes (83% Faster!)

Slow build times delay deployments and hinder development velocity. This article shares optimization strategies that reduced Astro build times dramatically on AWS Amplify.

The Challenge

With 200+ pages generated during each build, the process took over 30 minutes. One section required 900+ pages, further increasing delays. Unlike Vercel, AWS Amplify doesn't support Incremental Static Regeneration.

Avoid API Calls in Child Components

Child components making API calls trigger requests for each page individually during build, increasing time from milliseconds to seconds per page.

Use client:only="react" for React components or pass data as props from [slug].astro:

---
const { post } = Astro.props;
---

<PageLayout>
  <ChildComponent client:only="react" />
  <ChildComponent data={post}/>
</PageLayout>

Optimize API Calls in Layouts

Layouts making API calls (e.g., fetching latest blogs) trigger requests for every page built.

Implement caching using the build folder's cache directory:

import fs from "fs/promises";
import path from "path";

const CACHE_DIR = path.join(process.cwd(), "cache");
const CACHE_FILE = path.join(CACHE_DIR, "caseStudies.json");

async function fetchAndCacheCaseStudies() {
  await fs.mkdir(CACHE_DIR, { recursive: true });

  const cacheExists = await fs.access(CACHE_FILE)
    .then(() => true).catch(() => false);

  if (cacheExists) {
    return JSON.parse(await fs.readFile(CACHE_FILE, "utf-8"));
  }

  const res = await getAllCaseStudiesForHomePage();
  const data = res.data?.caseStudies?.data;
  await fs.writeFile(CACHE_FILE, JSON.stringify(data), "utf-8");
  return data;
}

Use a CDN for Large Assets

SSG copies everything from public/ into dist/, slowing builds with large files. Move large images and videos to a CDN — this reduces build times and keeps deployment sizes small.