PERF-001high SeverityPerformance, Assets & Bundle Optimization

Next/Image or Optimized Formats Used (No Multi-Megabyte PNGs)

AI puts raw 4MB screenshot PNGs into /public/hero.png and uses raw <img> tags instead of responsive next/image components.

1-Click Fix Prompt for Cursor & Claude Code
Review my codebase for "Next/Image or Optimized Formats Used (No Multi-Megabyte PNGs)" (PERF-001).
Issue: AI puts raw 4MB screenshot PNGs into /public/hero.png and uses raw <img> tags instead of responsive next/image components.
Remediation required: Convert hero images to WebP/AVIF and use next/image with responsive sizes and priority loading for above-the-fold assets.

Please:
1. Locate any occurrences of this issue across my repository.
2. Refactor the code to follow production standards without breaking existing functionality.
3. Provide a clear command or step to test and verify the fix.

Why AI Assistants Write This Bug

AI puts raw 4MB screenshot PNGs into /public/hero.png and uses raw <img> tags instead of responsive next/image components.

AI code generation prioritizes immediate syntax execution over production edge cases. When an assistant hits an undefined variable or strict type error, it frequently takes the path of least resistance rather than implementing standard pre-launch security patterns.

Code Comparison

Common AI Code PatternVulnerable
// Vulnerable AI-generated pattern for: Next/Image or Optimized Formats Used (No Multi-Megabyte PNGs)
// Problematic pattern: AI puts raw 4MB screenshot PNGs into /public/hero.png and uses raw <img> tags instead of responsive next/image components.
Launch-Ready Fix
// Production-ready fix for: Next/Image or Optimized Formats Used (No Multi-Megabyte PNGs)
// Recommended remediation: Convert hero images to WebP/AVIF and use next/image with responsive sizes and priority loading for above-the-fold assets.

Remediation & Verification Checklist

Remediation: Convert hero images to WebP/AVIF and use next/image with responsive sizes and priority loading for above-the-fold assets.
  1. Search your codebase for pattern matching "Next/Image or Optimized Formats Used (No Multi-Megabyte PNGs)".
  2. Apply the recommended remediation: Convert hero images to WebP/AVIF and use next/image with responsive sizes and priority loading for above-the-fold assets.
  3. Run local build and test commands to ensure no regressions.
  4. Verify in your browser or with curl that the issue is resolved.
Audit All 108 Checks in One Click

Checking items one by one takes hours. Let us do it in 2 minutes.

With the Founder Pass ($15 one-time), we automatically scan your repository for this issue, plus all other 107 launch checks across secrets, Stripe webhooks, Supabase RLS, and security headers.