# Static Sites

Use Astro by default. It is simple, fast, deploys as plain static files, and has a good built-in asset pipeline.

## Best practices
- Keep CSS and JS in a separate file so that it can be fingerprinted, compressed, and cached
- Keep source assets high quality; let the build pipeline create production variants.
- Use `astro:assets` (`Image` / `Picture`) for local images instead of plain `<img src={image.src}>`.
- Prefer AVIF/WebP with a JPEG or PNG fallback.
- Generate responsive widths and set accurate `sizes`.
- Mark only the above-the-fold LCP image as `priority`; lazy-load everything else.
- Configure Sharp defaults once in `astro.config.mjs` rather than manually editing images.
- Run Lighthouse after changes and look first at LCP, total byte weight, and image transfer sizes.