Scale of the Universe

Magnificent! Curious how the zoom interaction is managed? Do you load assets of next level once zoom level hit a certain threshold?

My guess is all the assets are preloaded. They are gradually added to the "stage" and shrunken/faded out based on the zoom level on an item-by-item basis (vs zoom levels.)

The background color would be its own "item."

I actually came across this site because I was looking for an example for a proposal for a fun project for this guy: https://youtu.be/1kjvgWBHzec (he tried a couple of non-programming video editing methods to achieve the zoom effect.)

It seems all images are stored in the file https://cdn.scaleofuniverse.com/sotu-avif.dave with some format I don't really know. It's some kind of container for avif images. It's loaded once.

loading everything upfront (a loading bar) was a better trade off than having unloaded images if you scrolled too fast.

making each image a separate file was not very efficient for basically every reason. i ended up writing my own streamable archive format called an "asset bundle". it is essentially all resources concatenated.

that code is public -> https://github.com/paperdave/assetbundle

the scale of the universe webapp loads all the assets, but then pixi.js objects are dynamically created and destroyed depending on the scale. i never fully verified but i hope does the right thing and keeps sprite data out of vram when it's not needed.