How to stop React website from freezing when calling updateState?

I have a page that loads a Material table using data from a database (DynamoDB).

The initial table load is fine, however when items are added to the table after about the 4th item the localhost website freezes.

I have chased it down to be caused by a updateState call that is taking the old and new table data and updating the state.

Here is the code:

Initial data fetch:

const [tableData, updateTableData] = useState([{}])

    useEffect( () => {
    async function refreshData()
    {
      console.log("Init load")
      var invData = await GetPartByType(props.itemType);
      updateTableData( invData )
    }
    refreshData()
  }, [])

update data function:

function updateData(newData)
{
    console.log("Updating Data")
    const invData = [...tableData, newData]
    updateTableData( invData )
}

When updateData() is called ~4 times the website freezes, with each entry getting slower and slower

Any help is appreciated!