These are chat archives for pixijs/pixi.js

6th
Mar 2017
Ove
@bakken
Mar 06 2017 15:23

Short question: What is the preferred way to upload a texture into GPU Memory with PIXI v4. Need to preload larger textures to avoid stuttering when they are loaded to GPU memory.

The textures were loaded with PIXI.loader, but i don’t know how to go from there.

renderer.updateTexture(texture.baseTexture) is not working anymore
Lenin
@Randore
Mar 06 2017 15:45
Hello, Is there an example - tutorials that point to how to use PIXI.loader.add().load(setup) to create "Game Preloader" ( progress bar that is shown before game assets are loaded)
Ove
@bakken
Mar 06 2017 15:53

@Randore PIXI.loader will emit a progress event while loading assets.

PIXI.loader.on('progress', (event) => { … })

event.progress will tell you how much the loader has progressed in 0–100

Lenin
@Randore
Mar 06 2017 16:20
@bakken I'll check
Lenin
@Randore
Mar 06 2017 16:45
Guys, if you using pixi with npm, then what build tools and unit resting tools are you using ?
I tried browserfy & live-server both worked fine for me. For unit testing I am planning to use Mocha or Jasmine.
Lenin
@Randore
Mar 06 2017 17:19
Can I use PIXI.Application instead of AutoDetectRenderer
renderer.plugins.prepare.upload( texture )
you don't need to specify the base texture yourself. You can even just provide a sprite, or a container. The prepare plugin will work it's magic to find the base textures to upload to the gpu
@Randore You can use whatever you want to use. PIXI.Application just sets up a few things for you automatically that you'd otherwise have to do manually with autoDetectRenderer. But sometimes you might want to retain that control; so both have their uses
PIXI.Application is a godsend for jsfiddles and example; no more manually creating a stage container, and setting up requestAnimationFrame etc.
Ove
@bakken
Mar 06 2017 18:27

Thanks Dave. Didn’t know that i can pass DisplayObjects aswell.

Maybe my case is weird then. I’m using exactly this method.
renderer.plugins.prepare.upload(PIXI.loader.ressources[resName].texture.baseTexture);

I will use this textures with a single PIXI.Sprite replacing it’s texture property.

if (changeSpriteTexture) {
sprite.texture = PIXI.loader.ressources[resName].texture
}

maybe that’s where it’s taking a bad turn

Dave Moore
@themoonrat
Mar 06 2017 18:29
@Randore currently using browserify (babel thrown in) and browsersync with chai for testing. So many options, no right or wrong answer :)
Ove
@bakken
Mar 06 2017 18:29
When this has been rendered once everything is smooth but the first time will cause a stutter.
Dave Moore
@themoonrat
Mar 06 2017 18:29
@bakken - PIXI.loader.resources - hopefully not just a typo causing your issue ;)
Ove
@bakken
Mar 06 2017 18:30
:smile: no just checked the code, there it’s used the right way
Dave Moore
@themoonrat
Mar 06 2017 18:30
What I do, is as each resource loads in from the loader, is then straight away upload that base texture to the GPU
that way, any stuttering from uploading to the gpu is hidden away in the loading screen
Ove
@bakken
Mar 06 2017 18:32
exactly what i’m trying to do :smile:
Dave Moore
@themoonrat
Mar 06 2017 18:32
The code I've got here works is
renderer.plugins.prepare.upload( PIXI.utils.BaseTextureCache[atlasID] );
(after each atlas loads in)
Ove
@bakken
Mar 06 2017 18:32
My understanding is this: once a Texture has been uploaded to the GPU i can use it with any DisplayObject withouth it beeing reuploaded.
Right now i do this:
this.bgTexCache = this.slides.map((slide) => {
  const _tex = PIXI.loader.resources[slide.comp[3200]].texture;
  this.renderer.plugins.prepare.upload(_tex);
  return _tex;
});
Dave Moore
@themoonrat
Mar 06 2017 18:35
on the assumption of your gpu having enough memory, then yes. You can forcefully remove a texture from gpu memory too via something like
if ( renderer.textureGC ) {
renderer.textureGC.unload( displayObject );
}
( if statement because the texture garbage collector doesn't exist for Canvas renderer)
Ove
@bakken
Mar 06 2017 18:35
and somewhere else
this.bgSprite.texture = this.bgTexCache[anIndex]
renderer.textGC.unload method new to PIXI v4? Was using an instance of PIXI.TextureGarbageCollector(renderer). Really need to catch up with all that new stuff.