Improve performance for the experiments table webview

[sroy3]

Removing functionalities until used

As learned from improving the plots webview performance, we do not need to set up every functionality all the time. We can anticipate its use and set it up when needed. For the experiments webview, these are the functionalities we can remove until needed to increase performance.

Contextual Menus

Even if they aren't always shown because they are inside of a tooltip, a RowContextMenu is created and re-rendered for each row. Since it also has complex props and state, removing the content of the contextual menus until needed can potentially save a lot of re-rendering time if there are a lot of rows.

Drag and Drop

Like the plots webview, the drag-and-drop functionality is always on. We pass down the following props multiple levels as well: onDragEnter, onDragEnd, onDragStart, onDrop, onDragLeave. Functions are complex objects and hard to optimize as props to avoid re-rendering. Creating two paths (one with drag-and-drop functionality and one without) can help mitigate this issue.

Other improvements to performance

Limit props drilling

Most of the time the table components are used by only one other component and do not need to be passed some props to distinguish it from being used elsewhere. Instead of drilling down the props, they can usually live in the lower component itself. If they cannot be moved, we can make use of Redux to get those props and dispatch events.

• Remove contextual menu content until shown
• Create a TableHeaderCell component with drag-and-drop events only on mouseDown
• Limit props drilling (especially complex props)

[shcheklein]

Not sure if this is related to the table itself or to the the queue, but the whole extension becomes unstable with 100 queued exps:

Screen.Recording.2024-01-20.at.2.09.10.PM.mov