perf(images): enable Next.js image optimization with fast internal docker proxy routing and clean button text SSR
This commit is contained in:
parent
0ff9a6b886
commit
e081441c22
@ -147,7 +147,7 @@ export default function Hero({ banners = [], onShopNavigate }: { banners?: Banne
|
||||
}}
|
||||
className="bg-canina-blue text-white px-3 sm:px-10 py-2 sm:py-5 rounded-full font-bold text-lg hover:bg-canina-blue/90 hover:shadow-2xl focus-visible:ring-4 focus-visible:ring-canina-blue/30 focus-visible:outline-none transition-all flex items-center gap-2 group font-vazir min-h-[58px] shadow-lg shadow-canina-blue/20 cursor-pointer"
|
||||
>
|
||||
{mounted && isInitialized ? getText('hero_btn_advisor', "دستیار سلامت پت") : "دستیار سلامت پت"}
|
||||
{getText('hero_btn_advisor', "دستیار سلامت پت")}
|
||||
<ChevronLeft className="w-5 h-5 group-hover:-translate-x-1 transition-transform" />
|
||||
</button>
|
||||
<button
|
||||
@ -160,7 +160,7 @@ export default function Hero({ banners = [], onShopNavigate }: { banners?: Banne
|
||||
}}
|
||||
className="bg-white border-2 border-medical-gray-900 text-medical-gray-900 px-3 sm:px-10 py-2 sm:py-5 rounded-full font-bold text-lg hover:bg-medical-gray-50 focus-visible:ring-4 focus-visible:ring-canina-blue/30 focus-visible:outline-none transition-all font-vazir min-h-[58px] shadow-sm cursor-pointer"
|
||||
>
|
||||
{mounted && isInitialized ? getText('hero_btn_products', "مشاهده محصولات") : "مشاهده محصولات"}
|
||||
{getText('hero_btn_products', "مشاهده محصولات")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -198,7 +198,8 @@ export default function Hero({ banners = [], onShopNavigate }: { banners?: Banne
|
||||
alt={banner.title || "Canina Pharma Germany"}
|
||||
fill
|
||||
priority={idx === 0}
|
||||
unoptimized={true}
|
||||
sizes="(max-width: 1024px) 100vw, 600px"
|
||||
quality={85}
|
||||
className="object-cover"
|
||||
/>
|
||||
</motion.div>
|
||||
@ -210,7 +211,8 @@ export default function Hero({ banners = [], onShopNavigate }: { banners?: Banne
|
||||
alt={activeBanner?.title || "Canina Pharma Germany"}
|
||||
fill
|
||||
priority
|
||||
unoptimized={true}
|
||||
sizes="(max-width: 1024px) 100vw, 600px"
|
||||
quality={85}
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -19,10 +19,10 @@ interface SafeImageProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>,
|
||||
height?: number;
|
||||
}
|
||||
|
||||
export default function SafeImage({
|
||||
src: rawSrc,
|
||||
alt = "تصویر مکمل کنینا",
|
||||
className,
|
||||
export default function SafeImage({
|
||||
src: rawSrc,
|
||||
alt = "تصویر مکمل کنینا",
|
||||
className,
|
||||
imgClassName,
|
||||
fallbackText = "در حال بروزرسانی تصویر...",
|
||||
priority = false,
|
||||
@ -92,9 +92,9 @@ export default function SafeImage({
|
||||
<Sparkles className="w-6 h-6 text-canina-blue/20" />
|
||||
</div>
|
||||
)}
|
||||
<Image
|
||||
src={src}
|
||||
alt={alt}
|
||||
<Image
|
||||
src={src}
|
||||
alt={alt}
|
||||
width={width}
|
||||
height={height}
|
||||
priority={priority}
|
||||
@ -102,20 +102,15 @@ export default function SafeImage({
|
||||
sizes={sizes}
|
||||
quality={quality}
|
||||
unoptimized={
|
||||
isBlobOrData ||
|
||||
isBlobOrData ||
|
||||
!isAllowedHost ||
|
||||
(typeof src === 'string' && (
|
||||
src.startsWith('/api/uploads/') ||
|
||||
src.startsWith('/api/media/') ||
|
||||
src.startsWith('/uploads/') ||
|
||||
src.toLowerCase().endsWith('.svg')
|
||||
))
|
||||
(typeof src === 'string' && src.toLowerCase().endsWith('.svg'))
|
||||
}
|
||||
className={cn(
|
||||
"transition-all duration-500 w-full h-full object-contain",
|
||||
imgClassName,
|
||||
loading && !priority ? "opacity-0 scale-105" : "opacity-100 scale-100"
|
||||
)}
|
||||
)}
|
||||
onLoad={() => setLoading(false)}
|
||||
onError={() => setError(true)}
|
||||
/>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user