تست بهینه‌سازی تصاویر با Sharp

این صفحه برای تست عملکرد Sharp و OptimizedImage Component طراحی شده است

تست اندازه‌های مختلف

اندازه کوچک (150x150)

محصول آرایشی تست

Quality: 75, Priority: true

اندازه متوسط (400x300)

کرم مراقبت پوست

Quality: 85, Lazy Loading

اندازه بزرگ (600x400)

محصولات زیبایی

Quality: 90, High Quality

تست تصاویر واکنش‌گرا

تصویر تست WebP

محصول آرایشی تست

Responsive sizes: (max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw

تصویر تست AVIF

کرم مراقبت پوست

Responsive sizes: (max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw

تصویر تست کیفیت بالا

محصولات زیبایی

Responsive sizes: (max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw

اطلاعات عملکرد

ویژگی‌های فعال

  • ✅ Sharp برای بهینه‌سازی تصاویر
  • ✅ فرمت‌های WebP و AVIF
  • ✅ Lazy Loading
  • ✅ Responsive Images
  • ✅ Quality Optimization
  • ✅ Priority Loading

تنظیمات Next.js

  • 📱 Device Sizes: 640-3840px
  • 🖼️ Image Sizes: 16-384px
  • ⚡ Compression: Enabled
  • 🔒 SVG Support: Enabled
  • ⏰ Cache TTL: 60 seconds
  • 🎯 Loader: Default (Sharp)

تست مدیریت خطا

تصویر معتبر

تصویر معتبر

تصویر نامعتبر (Fallback)

تصویر نامعتبر