Обернули строку списка в React.memo, но при вводе в поиск перерисовываются все 200 строк
const ContactRow = React.memo(({ contact, onPress }) => ...);
function Contacts() {
const [query, setQuery] = useState('');
return (
<FlatList
data={contacts}
renderItem={({ item }) => (
<ContactRow contact={item} onPress={() => openChat(item.id)} />
)}
/>
);
}
Профайлер показывает рендер каждой ContactRow на каждую букву в поиске. Почему memo не помогает?
- onPress — новая функция при каждом рендере
- React.memo не работает внутри FlatList
- contact сравнивается по значению полей
- useState сбрасывает кэш всех memo-компонентов
