Prepare and Destroy Texture from Video

[royibernthal]

Creating

 

I'm loading the video using PIXI loader, once loading is complete I'm executing something in the lines of:
 

var sprite: PIXI.Sprite = new PIXI.Sprite();

var video: HTMLVideoElement = PIXI.loader.resources['videos/test.mp4'].data;
var texture: PIXI.Texture = PIXI.Texture.fromVideo(video);

sprite.texture = texture;

 

Does it make sense to do something like this in order to prepare it?

this.app.renderer.plugins.prepare.add(texture.baseTexture);
this.app.renderer.plugins.prepare.upload();

 

In what cases should I be using VideoBaseTexture instead of Texture? (e.g. VideoBaseTexture.fromVideo() instead of Texture.fromVideo())

Displaying a VideoBaseTexture in a Sprite resulted in errors.

 

Destroying

 

In order to destroy a video, is it enough to destroy the texture I created from its video and call PIXI.loader.reset()?

 

If I wanted to specifically remove a single video - instead of calling PIXI.loader.reset(), would this line do the job or are there more things to do?

delete PIXI.loader.resources[asset]

 

[royibernthal]

Hey @xerver, it'd be great to know what you think.

[ivan.popelyshev]

Videos aren't possible to prepare. Encoder works only in realtime, uploading new textures every frame.

[xerver]

Prepare isn't going to help you with a video, since each frame we have to upload a new texture for the new frame of the video.

Quote

In order to destroy a video, is it enough to destroy the texture I created from its video and call PIXI.loader.reset()?

Yes.

[royibernthal]

2 hours ago, xerver said:

Prepare isn't going to help you with a video, since each frame we have to upload a new texture for the new frame of the video.

Uploading a new texture to the GPU for each frame sounds like a recipe for lag on mobile. Isn't it? (although it makes sense that's what you have to do in order to display a video)

That's precisely the reason we use prepare for images before displaying them, or do videos have a different solution behind the hood that take care of making things smooth?

 

Also, what about this question - 

In what cases should I be using VideoBaseTexture instead of Texture? (e.g. VideoBaseTexture.fromVideo() instead of Texture.fromVideo())

[ivan.popelyshev]

https://github.com/pixijs/pixi.js/blob/dev/src/core/textures/Texture.js#L351

[royibernthal]

2 minutes ago, ivan.popelyshev said:

https://github.com/pixijs/pixi.js/blob/dev/src/core/textures/Texture.js#L351

Got it thanks, that answered my second question. Now only this question remains:

 

Uploading a new texture to the GPU for each frame sounds like a recipe for lag on mobile. Isn't it? (although it makes sense that's what you have to do in order to display a video)

That's precisely the reason we use prepare for images before displaying them, or do videos have a different solution behind the hood that take care of making things smooth?

[xerver]

Prepare just allows you to control when the images get uploaded, that's all. Otherwise we upload them when you render them the first time. Video frames have to be uploaded each frame, that is just how it works. If that doesn't work for you, you have to use something else.

[royibernthal]

Yes I understand, but on cordova when uploading a big texture there's a small lag (0.5-2 seconds) until the texture finishes uploading to the GPU. With that said I'm having a hard time imagining videos playing smoothly on cordova with the way they work.

I guess my question is - was PIXI video developed with cordova in mind? Is it supposed to work smoothly on cordova?

[xerver]

2 hours ago, royibernthal said:

I guess my question is - was PIXI video developed with cordova in mind? Is it supposed to work smoothly on cordova?

I think you are misunderstanding. This is not a limitation of PixiJS. This is how WebGL works. We have to upload each frame to render it, there is no other option. Either that works for your use case or it doesn't, but either way there isn't anything we can do about it.

Specifically answering your question: No, PixiJS was not built specifically to work on cordova. We built it to work in the browser, on mobile and desktop. However, we do try to support Ejecta, CocoonJS, Cordova, et al.

[royibernthal]

Got it, thanks.