I am writing a web application to display images from a thermal imaging camera. I would like the application to display either static images (for example “get a current image”) or a real-time stream (up to 9 fps ideally although I could live with less and understand network latency would have to be considered). The use case is local (cameras + app + users are on the same network). The App connects to the camera(s) via a socket interface, takes their data and converts it to a false-color image for display in the web browser.
I have code running using a webcanvas. I looked back at the forums to find ideas and found a lot of discussion in about 2014 but not a lot since. Currently the app renders to a picture and the picture is drawn in the webcanvas paint event. The app causes a refresh event on any attached session connected to a camera that generates a new image by calling a method in the session (the method refreshes the webcanvas in the session’s webpage).
However it appears the browser is caching a copy of each picture (determined using the developer tools in chrome). This seems problematic for the display of image streams (could be many thousands or ten thousands of images streamed in a session).
I am a hardware developer primarily and my knowledge of web software development is pretty much nil (that’s why I use xojo!) so I may not even be correctly stating my request/concern.
It seems to me that I don’t need the browser to cache anything (except, perhaps the last image) since each image is unique and won’t be repeated. Is there a best way to implement such a display? Or does the browser automagically handle/limit caching and I shouldn’t worry about it at all?