perf: use OptimizedImage in CatalogSlider

This commit is contained in:
Kirill
2026-05-15 13:29:58 +05:00
parent 8965eb6dad
commit 35ddb17247
@@ -6,6 +6,7 @@ import Typography from '@mui/material/Typography'
import { useQuery } from '@tanstack/react-query' import { useQuery } from '@tanstack/react-query'
import type { CatalogSliderSlide } from '@/entities/catalog-slider' import type { CatalogSliderSlide } from '@/entities/catalog-slider'
import { fetchCatalogSlider } from '@/entities/catalog-slider' import { fetchCatalogSlider } from '@/entities/catalog-slider'
import { OptimizedImage } from '@/shared/ui/OptimizedImage'
const AUTO_MS = 5500 const AUTO_MS = 5500
@@ -62,20 +63,26 @@ function CatalogSliderInner({ slides }: { slides: CatalogSliderSlide[] }) {
}} }}
> >
<Box <Box
component="img"
src={slide.url}
alt={captionText || 'Слайд каталога'}
loading={i === 0 ? 'eager' : 'lazy'}
sx={{ sx={{
position: 'absolute', position: 'absolute',
inset: 0, inset: 0,
width: '100%', width: '100%',
height: '100%', height: '100%',
objectFit: 'cover',
display: 'block',
zIndex: 0, zIndex: 0,
}} }}
/> >
<OptimizedImage
src={slide.url}
alt={captionText || 'Слайд каталога'}
priority={i === 0}
sizes="(max-width: 600px) 320px, (max-width: 1024px) 1024px, 1600px"
sx={{
width: '100%',
height: '100%',
objectFit: 'cover',
}}
/>
</Box>
{captionText ? ( {captionText ? (
<Box <Box
sx={{ sx={{