I'm creating a web application that is visually enormous. I'm talking 2 million pixels wide and 2 million pixels tall (about).
My goal is to show dynamically changing spots all over the site. For loading's sake, would it be best to load a single large, low quality image per screen view? or show about 2000 html elements per screen view?
I have about 255 "sections" on the site, each section is 120,390px square. I only show the correct section on the screen, which means I would only ever see 4 sections at a time. Inside of these sections I have little spots that are about 30px square. each little square is being pulled from a database to get the color, which could potentially change at any time. But these squares are only pulled when the user's view goes there. So at most, it would show around 2-3000 squares.
Again, would it be less processing power and faster to load a single picture (let's say the picture is about 5000px wide, with the colors on it, it would be around 50k at low quality) or would it be faster/better to load every square individually?