Both components are updated in realtime by a websocket.
I noticed that the chart by itself is very fast. But as soon as the progressbar is added, the entire webpage and even the entire machine becomes very slow. I guess this is because every bit of progressbar update, the browser rerender the entire page, as the progressbar is a div.
I don't know how to solve this. I thought about using react for its virtual dom. but if eventually I need to update the dom, the speed seems to be the same.
I made a webpage based on a bootstrap template
On this webpage, I have 2 realtime components. one is a chart, based on dygraphs
the other component is a bootstrap progressbar.
the bootstrap progressbar is made by html divs:
https://www.w3schools.com/Bootstrap/bootstrap_progressbars.a...
Both components are updated in realtime by a websocket.
I noticed that the chart by itself is very fast. But as soon as the progressbar is added, the entire webpage and even the entire machine becomes very slow. I guess this is because every bit of progressbar update, the browser rerender the entire page, as the progressbar is a div.
I don't know how to solve this. I thought about using react for its virtual dom. but if eventually I need to update the dom, the speed seems to be the same.