search

frnsys / half_earth

Half-Earth Socialism: The Game, for Half-Earth Socialism (Verso 2022)
GNU Affero General Public License v3.0
41 stars 7 forks source link

Preloading assets behind a loading screen #105

Closed entityleak closed 2 years ago

entityleak commented 2 years ago

Because we're a game, we can expect players to wait a few seconds on a loading screen before being able to interact with the site. It also adds a bit of drama ;)

We can then eliminate image and font pop-ins that make the game look a bit uglier.

Also will make using heavier PNG images more bearable if they all load in at the beginning.

--

counterpoint - we might expect people on mobile to have less tolerance for loading screens which might also be slower on mobile connections.

entityleak commented 2 years ago

https://www.htmlgoodies.com/design/so-you-want-to-pre-load-huh/

frnsys commented 2 years ago

I added a loading screen here: https://github.com/frnsys/half_earth/blob/main/src/components/Loading.vue

You can just add more assets to the preload array and they should preload

entityleak commented 2 years ago

When the app is deployed it's loading stuff that was output by parse_content.py , i.e.

/dist/b7c19ec2172c4da48df2.png

/assets/content/images/1635431067.781844.png

These aren't being preloaded, and entering them manually wouldn't make so much sense.

I think a good solution would be to create another JSON file as part of parse_content that makes a simple array of all main image assets (project and event images included) then we can import that into the loading screen to preload?

I'm not so hot with python but i've give it a shot.

frnsys commented 2 years ago

I think we're all set on this--let me know if other stuff needs to be added