Load asset packages

[alevys]

Hi! Please tell me, what is the best practice for loading assets in Pixi? As I understand it, the Loader only supports the direct download of the files as png, img, and so on. If I want to upload everything as a zip archive with encryption, and how best to proceed? In this case, the class Loader I don't need anymore, right? Thank you

[ivan.popelyshev]

Yep, you need your own loader for that. Though, you can use loader as XHR for zip.

Here is the loader that is used in pixi : https://github.com/englercj/resource-loader/ 

Pixi bindings : https://github.com/pixijs/pixi.js/tree/dev/src/loaders

Spritesheet and texture parsers are separated from loaders, so even if you build pixi without loader, you'll be able to use them.

Pixi loader is enough for demos, prototyping and promo-games, but for serious app you need better loader and better caching system.

[alevys]

Ivan thank you, very useful information

[ivan.popelyshev]

Make sure that you start your own loader after you test canonical ways, beware premature optimization!

1) combine many small images to atlas through https://github.com/Bibernull/spritesheetjs or https://renderhjs.net/shoebox/ or https://www.codeandweb.com/texturepacker  - that enables batching optimizations and rendering process becomes much faster , also it loads faster

2) for PCs try convert textures to DDS (dxt3 or dxt5) format and load them through https://github.com/pixijs/pixi-compressed-textures - eats less videomemory (x0.25), that is not possible with png's

3) enable gzip on server - very effective for DDS, dds+gzip downloadsfaster than png both through network and loads faster in the app memory

Only if it is not enough for your app, then go for gzipped packs.

 

[alevys]

Ivan many thanks

[ivan.popelyshev]

Btw, you'll have to unpack zip with js which is kinda bad. Better to store "tar" or something like that and ask web-server to gzip it, that way browser will unzip it natively and you get the pure data.