Performance
Image CDN Compare
Compare the same public asset via raw URL vs /_next/image — size and Content-Type table.
Run this experiment yourself
Demos are not embedded on this site. Deploy a standalone copy on Vercel or run the experiment app locally.
Local development
cd apps/experiments/image-cdn-compare pnpm install pnpm dev
Then open http://localhost:3010.
This is an experimental demo. Use it as a starting point for your own projects.
Measure raw public URL vs /_next/image for the same sample asset (size + Content-Type).
Features
- Standalone Next.js app under
apps/experiments/image-cdn-compare/. - Honest degradation when optional services are missing.
- Unit-tested helpers in
logic.ts.
API Reference
POST /api/compare
{ "path", "width", "quality" }Implementation Details
Run the demo
Use the embedded playground or pnpm dev in the experiment app.
Inspect the handlers
Copy Route Handlers from apps/experiments/image-cdn-compare/ into your project.
Limitations
- Educational demo — not a production-hardened product.
- Inputs are length-capped.
Use in your project
Copy the experiment folder or individual Route Handlers.
Deployment
Local Development
cd apps/experiments/image-cdn-compare
pnpm install
pnpm devConfiguration
| Variable | Required | Purpose |
|---|---|---|
| — | — | No required secrets |
Vercel / Next.js Features Used
- Next.js, Image Optimization