muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

added lazy loading to flow hero

Browse source
This commit is contained in:
Fedor Katurov 2022-12-05 18:08:35 +06:00
parent 50f561de96
commit 71764af45f
1 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/flow/FlowSwiperHero/index.tsx
View file

@ -29,8 +29,11 @@ const autoplay = {
}; };
const lazy = { const lazy = {
loadPrevNextAmount: 3, enabled: true,
checkInView: false, loadPrevNextAmount: 2,
loadOnTransitionStart: true,
loadPrevNext: true,
checkInView: true,
}; };
export const FlowSwiperHero: FC<Props> = ({ heroes }) => { export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
@ -130,13 +133,14 @@ export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
onClick={onClick} onClick={onClick}
followFinger followFinger
shortSwipes={false} shortSwipes={false}
watchSlidesProgress
> >
{heroes {heroes
.filter(node => node.thumbnail) .filter((node) => node.thumbnail)
.map(node => ( .map((node) => (
<SwiperSlide key={node.id}> <SwiperSlide key={node.id}>
<img <img
src={getURLFromString(node.thumbnail!, preset)} data-src={getURLFromString(node.thumbnail!, preset)}
alt="" alt=""
className={classNames(styles.preview, 'swiper-lazy')} className={classNames(styles.preview, 'swiper-lazy')}
/> />