reactrondev / react-native-web-swiper

Swiper-Slider for React-Native and React-Native-Web
213 stars 55 forks source link

Swiper is Laggy on Mobile phones #66

Closed vrinch closed 1 year ago

vrinch commented 3 years ago

The swiper works very well on desktop browsers, but gets laggy on some mobile phones, while on some, it does not show up at all

kopax-polyconseil commented 3 years ago

@vrinch we don't need more information obviously we will help you. Just kidding, what phones ? What code ? Do you have a snack we can use to reproduce?

hohoaisan commented 2 years ago

You can use props passed into each slide to determine the logic inside it should be run or not here By default Swiper tries to render all the element, by returning null in some invisible item can improve performance.

type PageProps = {
  index?: number;
  activeIndex?: number;
} & ChapterPage;

export const Page: React.FC<PageProps> = ({index, activeIndex, ...page}) => {
  if (
    index &&
    activeIndex &&
    index !== activeIndex
  ) {
    return null;
  }
  return (
  // rest of the heavy logic of the slide
  )
}
jarvisluong commented 1 year ago

The issue seems to be stale. Please re-open if this is still needed, thanks.