High memory usage

[GRyall]

I left a tab open in Firefox overnight in the background with the wall display open. When I went to the tab this morning it was slow and unresponsive. When I closed the tab, Firefox memory usage declined by 650MB.

[rerpha]

Could you see if this is also the case for:

• the “instruments” page
• One of the instruments pages, preferably with loads of blocks

[rerpha]

I think if it's just the instruments page I know exactly why - we use a different bit of logic on there and I have a feeling we're subscribing to the instlist every render, i'll do some profiling on it.

[Tom-Willemsen]

The most obvious place we've seen this is the wall display page used for standup - but could also be happening elsewhere

[rerpha]

ok - i'll have a look, cheers.

[rerpha]

OK, I've figured this out. It's just the wall display, and the reason is we are using setInterval(5000) outside of a useEffect when getting the beam info image, then not clearing it, which means that the interval hooks get stored after every render(which happens every few milliseconds!). This means you end up with a huge buffer as well as the hooks not actually getting called every 5s in sequence. I actually managed to crash a chrome tab after about 45 mins as the memory limit is 512mb.

A bit more info on this here: https://www.geeksforgeeks.org/how-to-use-setinterval-method-inside-react-components/

This issue also meant that the interval wasn't actually working so this also fixes that. I've also slowed it from 5s to 15s as the image itself only updates every minute.

PR: #82