🚀 The feature

Currently, images in src/assets/ total ~4.6 MB, with resonateapp.png alone being 2.71 MB, significantly impacting page load time.

The Problem is that there is :

• No image optimization in the build process

• Slow page load, especially on mobile/slow networks

• Poor Core Web Vitals (LCP affected)

My Solution:

1. Add a scripts/optimize-images.js using Sharp to:

   • Compress PNG files with quality optimization
   • Generate WebP versions for modern browsers

2. Add prebuild npm script for automatic optimization

3. Add loading="lazy" to below-fold images

The impact by this solution will help reduce almost 90% reduction in image payload which may help us in :

• Faster initial page load
• Improved mobile experience
• Better Lighthouse/Core Web Vitals scores.