Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

slowness #471

Open
arshiya-adafsa opened this issue Aug 1, 2023 · 1 comment
Open

slowness #471

arshiya-adafsa opened this issue Aug 1, 2023 · 1 comment

Comments

@arshiya-adafsa
Copy link

arshiya-adafsa commented Aug 1, 2023

very slow when there is more than 20 items

@kashmiry
Copy link

kashmiry commented Jul 8, 2024

I was facing the same issue. I made a few improvements to my implementation and was able to enhance performance.

1- I made sure I am passing components correctly
I am utilizing touchableComponent prop.
I was passing it like this:

<Accordion
    touchableComponent={(props) => <myTouchable {...props}>}
    {...}
/>

corrected it by passing it directly to avoid re-renders

<Accordion
    touchableComponent={myTouchable}
    {...}
/>

2- I used useMemo
for renderSectionTitle, renderHeader, renderConten to also avoid re-render when state is changed.

const SliderHeader = React.memo(({ item }) => {
    ...
});
<Accordion
    renderHeader={(item) => <SliderHeader item={item} />}
    {...}
/>

Review your code throughly and make sure your utilizing React Memo when its needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants