use useMemo for large tables in react without react-table

Question

I have a table that has a big database, 2k lines +

So I had a function to filter and organize this working, but it takes 1-2 secs to filter, is it possible to do with useMemo or useCallBack since I always need to redo the database?

export default function Table(props) {


 const [order, setOrder] = useState(true);

  function handleHeaderClick(clickedHeader) {
    setOrder(!order);
    const newdata = props.data.sort((a, b) => {
      const x = a[clickedHeader];
      const y = b[clickedHeader];
      if (order && x > y) return -1; 
      return 1;
    });
    props.setdata(newdata);
  }

  function createHeader(header, index) {
    if (header.includes("BET") || header.includes("C") || header.includes("CHECK")) {
      return (
        <th onClick={(e) => handleHeaderClick(header)} key={index}>
          {header}
        </th>
      );
    }
  }

  function createRow(row) {
    // ♠♥♦♣
    try {
      return row.replace(/s/g, "♠").replace(/d/g, "♦").replace(/c/g, "♣");
    } catch (e) {
      return row;
    }
  }

  function tableRow(row, indexRow) {
    return (
      <tr key={indexRow}>
        {Object.keys(row).map((hd) => {
          const value = createRow(props.data[indexRow][hd]);
          if (hd.includes("BET") || hd.includes("C") || hd.includes("CHECK")) {
            return (
              <td className={value[1]} key={hd}>
                {value}
              </td>
            );
          }
        })}
      </tr>
    );
  }

  return (
    <table>
      <thead>
        <tr>{Object.keys(props.data[0]).map((header, indexHeader) => createHeader(header, indexHeader))}</tr>
      </thead>
      <tbody>{props.data.map((row, indexRow) => tableRow(row, indexRow))}</tbody>
    </table>
  );
}

I think I have to change something in my handleHeaderClick function, I have already tried some solutions of this type

  const test = useMemo(() => handleHeaderClick, [props.data]);

but my code stops working

where's my table @edit violation on chrome

[Violation] 'setTimeout' handler took 1458ms

@edit2 On firefox works correct