저는 React 애플리케이션을 개발 중이며 많은 항목 목록(수천 행)을 표시해야 합니다. 현재 사용자가 목록을 스크롤하거나 항목을 필터링할 때 성능이 매우 느립니다. 사용자 경험을 향상시키기 위해 React 애플리케이션의 성능을 최적화할 수 있는 방법이 있습니까?
추가 정보:
- 저는 React 함수 구성 요소와 후크를 사용하여 항목 목록을 렌더링하고 있습니다. - 목록의 각 항목에는 텍스트와 그림을 포함한 여러 데이터 필드가 포함되어 있습니다.
- 현재 내장된 지도 기능을 사용하여 항목 목록을 렌더링하고 있습니다.
- 라이브러리를 사용하여 항목 목록 필터링 및 정렬을 처리하고 있습니다.
- 성능 향상을 위해 shouldComponentUpdate 및 React.memo를 사용해 보았으나 여전히 속도가 충분하지 않습니다.
타사 라이브러리를 사용하거나 필요한 경우 애플리케이션의 일부를 다시 작성하는 등 어떤 제안이라도 환영합니다. 도움을 주셔서 미리 감사드립니다!
P粉2872545882024-01-17 10:36:09
라이브러리 react-window를 사용할 수 있습니다. 요소 수가 많은 목록의 스크롤을 가상화하는 데 유용하며 성능 조정에 도움이 됩니다.