Load Image From URL freezing issue

I am loading an Image from URL to a Plane, but it is freezing. For image to load i used the playcanvas example project
here it is
https://playcanvas.com/project/445011/overview/loading-image-from-the-web
Below is the gif of the freezing issue, when i click on the button it will load image from URL. The cube has a simple rotation script.
ImageFromURL

Hi @Adhil,

I can’t see a freeze in the sample project you posted, though there is a number of reasons this might be happening.

Javascript/WebGL run in a single thread so a number of blocking actions like texture uploading or material updating can slow down the app momentarily in slower devices.

Good practices to avoid these slow downs:

  • preload/prefetch the images
  • upload the images/textures on the GPU before your main gameplay loop starts
  • avoid calls to material.update() instead try updating only specific material parameters:
self.entity.model.material.setParameter('texture_diffuseMap', texture);

Hi, I tried this API but it is not updating the material and I am a unity developer new to playcanvas. can you look at my code and suggest to me what I am doing wrong.
Here is the build


and below is the project
https://playcanvas.com/project/660504/overview/ar-book
The top left button will use material.Update() and it is working fine but you can see lag when loading the texture. And the top Right button use material.setparameter API but it is not updating material.

I think the reason could well be the image size you are trying to load, which is 3120x4160 (4.2 Mb). Running a profiler, shows VRAM jumps from ~7 to almost 60Mb on that button click.

Try to use an url to a smaller image.

Edit:
Removed URL to image, since this forum changes it. Basically, for tests, you can grab any image url from imgur.

2 Likes