Timestep is heavier than necessary when building an HTML5 canvas/WebGL game for one reason: the logic implemented to make timestep cross-platform (native, canvas, dom) was also responsible for including all the platform specific features in the build (even when unnecessary).
2 - Loading system
The current loader does not provide some features that are necessary to empower the developer with the tools he need to give the best user experience:
retry system
handling loading priorities
prepare loading groups whose loading requests can be initiated any time
guaranteeing a maximum number of assets loading simultaneously
using asset cache in a consistent manner
How
1 - Build size
It was possible to remove the cross-platform overhead by removing all the code related to native and dom and also the code responsible for making timestep cross-platform.
2 - Loading System
All the loading logic was moved from 3 different places (AudioLoader.js, Image.js and loader.js) to a single location loader.js.
All the assets now go through a unique loading pipeline that keeps track of how many assets are loading in parallel and handles all the requests by looking at their respective priorities.
The loader was also made responsible for caching assets and retrieving cached assets.
Result
1 - Build size
About 4000 lines of codes were removed from the code base.
On a concrete example the build size went from 240KB to 170KB when switching to ministep.
2 - Loading System
On the same concrete example, the loading system allowed to have sounds load in parallel with a low priority and therefore not interfere with more urgent assets.
Being able to decide when to initiate the loading of groups of assets also allowed to get the player in game faster (some assets being unnecessary at launch time).
Iterating on the loading system should now be easier as it is centralized.
Future work
The retry system is a work in progress that would be necessary in order to reduce the number of missing asset issues. Note: The retry logic being confined to a single file, primitiveLoaders.js.
includes #129
Why
Two problems were identified:
1 - Build size
Timestep is heavier than necessary when building an HTML5 canvas/WebGL game for one reason: the logic implemented to make timestep cross-platform (native, canvas, dom) was also responsible for including all the platform specific features in the build (even when unnecessary).
2 - Loading system
The current loader does not provide some features that are necessary to empower the developer with the tools he need to give the best user experience:
How
1 - Build size
It was possible to remove the cross-platform overhead by removing all the code related to native and dom and also the code responsible for making timestep cross-platform.
2 - Loading System
All the loading logic was moved from 3 different places (
AudioLoader.js
,Image.js
andloader.js
) to a single locationloader.js
. All the assets now go through a unique loading pipeline that keeps track of how many assets are loading in parallel and handles all the requests by looking at their respective priorities. The loader was also made responsible for caching assets and retrieving cached assets.Result
1 - Build size
2 - Loading System
Future work
The retry system is a work in progress that would be necessary in order to reduce the number of missing asset issues. Note: The retry logic being confined to a single file,
primitiveLoaders.js
.