Long delay to open save layout dialog

[cfisher-scottlogic]

Background

The 'save layout dialog' takes a really long time to open in certain situations. It appears to be isolated to when there are multiple components on the page where lots of data is being continually updated.

Reproduction Steps

1. Run the showcase from vuu-ui (npm build then npm run showcase:build)
2. Open "ShellWithNewThemeAndLayoutManagement
3. Customise a layout which has frequent data updates (specific configuration I used below)

5. Open the context menu on the main tab header
6. Click "Save Layout"

Expected Behaviour

The Save Layout dialog shows within a couple of seconds, although ideally it would be almost instantaneous.

Actual Behaviour

The Save Layout dialog shows after ~10 seconds

Possible solutions

• Identify what the problem is (slow screenshot generation?)
• Make sure Dialog opening is not reliant on a screenshot being generated
  • if screenshot generation is slow, consider using a spinner as the screenshot placeholder whilst it's being generated
• Suspend the updates (see dataSource.suspend?.(); in useFilterTable.tsx)

Notes

I don't remember consciously load-testing the functionality with a high quantity of high frequency data tables at any point, so I can't be certain when this was introduced. The culprit could be as far back as the screenshot implementation, or it could be a more recent 'persistence implementation' problem. Investigation required.

These warnings appear in the console, though I'm not sure if they're related to the issue: