React-window: 부모가 다시 렌더링할 때 _row_ 구성 요소 내부의 useMemo

문서의 이 부분을 읽으셨습니까? https://react-window.now.sh/#/examples/list/memoized -list-items

두 가지 내장 메모이제이션 옵션이 있습니다.

• 이것은 React.memo
• 그리고 이것은 클래스 구성 요소에 대한 것입니다.

예제에서 사용하는 것처럼 보이지 않으므로 react-window가 스타일 캐시를 관리하는 방식으로 인해 불필요한 다시 렌더링이 발생합니다.

이 문제는 이 라이브러리의 일부에서 변경할 필요가 없다고 생각하므로 닫겠습니다. 명확한 질문이 있으면 더 이야기할 수 있습니다.

다시 안녕,

내 예는 내가 표현하려고 했던 것에 대해 가장 웅변적이지 않았지만 지금은 할 수 있다고 생각합니다.

귀하의 예제에서 시작 (memoized -리스트 항목) 만보기에 와서려고하는 _rows_ 렌더링의 상단에, 나는 당신이 항목을 클릭하면 현재 활성화하기 (항목을 _activate_ 때 또한이 렌더링 최소화하려면 , 보기의 모든 _rows_가 다시 렌더링됩니다).

나는 결국 FixedSizeList 에 itemData 소품을 사용하는 것을 달성했습니다(이를 통해 중첩 클로저를 피할 수 있음). 이것은 차례로 useMemo 합니다.

이 문제는 종료된 상태로 유지되어야 하지만 흥미로운 예/최적화 연습이라고 생각하며 추가 의견을 보내주시면 감사하겠습니다.

결과는 다음과 같습니다. https://codesandbox.io/s/rr7w89w3q

래퍼 비용으로 EXPENSIVE RENDER 를 피합니다: CHEAP PREP .

이 라이브러리에 쏟은 노력에 감사드립니다.

네, 이해가 됩니다. itemData 변경되면 _의도적으로_ 항목 캐시가 손상됩니다. 대부분의 경우 이것이 부실 데이터를 방지하기 위해 수행하려는 작업입니다. 이것이 특정 사용 사례에 해당되지 않는다는 것을 알고 있다면 당신이 한 것과 같은 일부 사용자 정의 논리가 적절해 보입니다. 👍