Site Speed Optimization
Performance
Audits stylesheet loading, inline CSS volume, image alt text, image formats, and Next.js Image component usage.
Key Checks
Total external script count
Inline CSS volume
Stylesheet count
Image alt text
Image formats (WebP/AVIF)
Next.js Image component usage
Audit Checks
| Check | Status | Rule |
|---|---|---|
| More than 10 external scripts | WARN | Consider bundling or removing unused scripts |
| Inline CSS > 5000 characters | WARN | Move styles to external stylesheet |
| Stylesheets > 3 | WARN | Consider combining CSS files |
| Image missing alt attribute | FAIL | Critical for SEO and accessibility |
| Images using JPG/PNG/GIF | WARN | Consider WebP or AVIF |
| Not using Next.js Image component | WARN | Use <Image> for auto optimization |
Industry Thresholds
Max external scripts
10
Max inline CSS
5000 characters
Max stylesheets
3
Image alt text
Required on all images
Related Skills
Edge Cases
- Inline <script> tags (no src) are separate from external scripts
- Base64-encoded images bypass network but increase HTML size
- SVG images don't need WebP/AVIF conversion
Try These Prompts
Copy any prompt below and paste it into your AI coding agent to run Site Speed Optimization checks:
“How many external scripts does this page load? Are there more than 10?”
“Is my inline CSS volume under 5000 characters?”
“Are all images using alt attributes? Which ones are missing alt text?”
“Which images are still in JPG/PNG/GIF format instead of WebP or AVIF?”
“Am I using the Next.js Image component or plain img tags?”