I'm doing it because the site is too slow where people don't stay/staring at a loading icon. 0.5Mbps and lower is really annoying to deploy a photo-based site gee who would have known.

The Dom loads just over 1 second, but things are still waiting to show up(js?) So I'm thinking of building empty templates like "Hey something is here don't worry."

I don't know. I'm actually not sure what progressive loading is. I currently use that blur-up method but I've seen those sites that use a technique where the photo is super pixelated (large pixels about a quarter of an inch or 1/8) before loading the high res. I think that is true progressive loading but don't know what it means with code.

server side render or put in HTML as placeholder. I've wanted to placeholder images with the primary color or some gradient that can be made in canvas but never got around to it for a project.

I never really understood what that meant. Server-side render it's not template generation? Time to learn how to read.

I do build a template and spit it out according to what is requested, but then a JS function runs to "fill in the blanks" with a secondary call for the missing data. I should probably get rid of the images formatting (based on aspect ratio) to fit into the tiles. I don't know...