79285775

Date: 2024-12-16 18:57:54
Score: 1
Natty:
Report link

One way is to normalize the data. You can read about it here: https://redux.js.org/tutorials/essentials/part-6-performance-normalization#normalizing-data

Another way is to use shallowEqual. https://react-redux.js.org/api/hooks#equality-comparisons-and-updates

// (1)
import { shallowEqual } from 'react-redux';

import { MyEvent, getEventsByUser } from './state/events.slice';
import { useAppSelector } from './state/hooks';

export function EventsRow({ user }: { user: string }) {
  console.warn('Events Row rendered for user: ' + user);
  const events: MyEvent[] = useAppSelector(
    (state) => getEventsByUser(state, user),
    // (2)
    shallowEqual
  );

  return (
    <div id={`user-${user}`}>
      {events.map((x) => (
        <div>{x.title}</div>
      ))}
    </div>
  );
}

Reasons:
  • Probably link only (1):
  • Long answer (-0.5):
  • Has code block (-0.5):
  • Low reputation (1):
Posted by: y0u