Advanced Features Deep Dive

Now that you’ve got the basics down, let’s explore jam-gen’s more powerful features.

Proxy Configuration

jam-gen automatically generates a proxy.json file alongside your static output. This file contains routing information for your reverse proxy:

{
  "routes": [
    { "path": "/", "file": "index.html", "cache": "1h" },
    { "path": "/blog/my-post/", "file": "blog/my-post/index.html", "cache": "24h" }
  ],
  "redirects": {},
  "headers": {}
}

Cache Control

Blog posts get a 24-hour cache by default, while pages get 1-hour caching. You can customize this per-post with the cache frontmatter field.

Docker Deployment

jam-gen ships with Docker support for CI/CD pipelines:

FROM jam-gen:latest

VOLUME ["/content", "/theme", "/output"]

# Mount your content and run
# docker run -v ./content:/content -v ./output:/output jam-gen

Concourse Integration

jobs:
  - name: build-site
    plan:
      - get: content-repo
        trigger: true
      - task: build
        config:
          image_resource:
            type: registry-image
            source: { repository: jam-gen }
          inputs:
            - name: content-repo
          outputs:
            - name: site

Custom Theming

Themes override the default components:

theme/
├── components/
│   └── PostCard.tsx    # Custom post card
├── layouts/
│   └── BlogPost.astro  # Custom blog layout
└── styles/
    └── custom.css

React Islands

For interactive components, use React with selective hydration:

---
import { Counter } from '../components/Counter';
---

<Counter client:visible />

Hydration strategies:

• client:load - Hydrate immediately
• client:visible - Hydrate when visible
• client:idle - Hydrate when browser is idle

Performance Tips

1. Minimize client-side JS - Use Astro components for static content
2. Optimize images - Use modern formats (WebP, AVIF)
3. Leverage caching - Configure appropriate cache headers
4. Preload critical assets - Add preload hints for fonts and critical CSS