Loading issue with the published file taking more time

[Escape25546216ddlh]

We have developed animation in animate 2022 in html canvas, After launching publish file on browser. it taking more than 1 min on loading.

Could some one please help me out how can we resolve this issue while we developed same animation in another tools they are loading very fast.

Looking forward to your reply.

Thanks

Prasad

[kglad]

save your fla to a new directory.

publish.

upload all the files (except the fla) to a file server and post a link to your html.

[Escape25546216ddlh]

Hi Kglad,

Thanks for looking on this as you requested please find below download link with all published files, please check once and let me know if anything required.

Download Link:
https://we.tl/t-wCkIY7pA9p

Looking forward to your quick reply.

Thanks

Prasad

[kglad]

you misunderstood.

i don't want to download your files.  i want to test their loading in my browser.

[Escape25546216ddlh]

Hi Kglad,

We did same thing as you said after that only the issue is coming like it is taking max to max 15-20 sec time to load the file and my internet bandwidth was 100MBPS.

Thanks

Prasad

[Colin Holgate]

The html won't run locally because of security issues, and I don't easily have a web site to put the files onto.

But, I do see something to suggest. Edit the 1600x600.html file and look for this line:

var loader = new createjs.LoadQueue(false);

Add this after that line:

loader.setMaxConnections(6);

That should speed up the loading of the page.

[Escape25546216ddlh]

Hi Colin,

Thanks for your support we will modify the index.html file as you mentioned and let you know.

Thanks

Prasad 

[peor]

I have the same thing that it takes time to load with HTML5 Canvas. But then my png files are 8Mb and 9Mb large. I have tested loader.setMaxConnections(6); in index.html but there will be no improvement or any difference. Why should it take time to load in the chrome browser. Is there no other solution.

[kglad]

why do you think your browser makes any difference?

anyway, if your mbps download speed (download speed test - Google Search) is 136, you would expect those two pngs to require 1 second to load after their loading starts.

[peor]

It has nothing to do with bandwidth or broadband speed. For example, the slideshow with 120 images with the best quality in HTML5 canvas when I publish it. Then the number of png files will be 9Mb and 8Mb and 7Mb. When I upload them to my domain name, it takes time to load it. Why does it do that? I also have to refresh the browser sometimes when it hangs.

[kglad]

you have 120 images, each between 7 and 9 mb?

[peor]

Yes, they are. But it might not be possible to do anything about it and then I mean it takes so long time to load it.

[kglad]

well, that's about 1 gigabyte of images. you should load all via code so you can do an initial load quickly and thrn show load progress.

[peor]

I use the program Animate to create slideshows. Then I import images in .jpg files to the library and convert them to bitmap and there are 120 images. Do you mean that I should code to HTML5 and javascript .js and Cascading Style Sheets .css How do I do what you describe by doing in codes. I'm not that good at keeping up with programming codes instead I want to copy and use them. I have nothing more to say so this will be the last.

[kglad]

okay then. over and out.

but, for others: put a splash screen in the first frame that will load quickly.  put a button on that frame that says something like, start slideshow and advances to the next frame.

on that next frame put your loader code and a preloader that shows the load progress of your images, PreloadJS v1.0.0 API Documentation : LoadQueue (createjs.com)

[shaver80]

I know this is a very late post but I had this issue a while back. Preloader.js loads sprites and assets one at a time. Its a surprising bottleneck. A browser can handle to load files asynchronously and preloader.js should be updated to do this.

I ended up ditching preloader.js for my own that loads the assets and it went from 2.2 minutes to 6 seconds. There are a lot of things that preloader.js file does that I am not doing but for basic loading images asynchronously it worked way better. Note, if you have sound or videos in the manifest, it will bomb out. I plan on fixing that but I haven't been doing much animate as of late. 

Below is the javascript. You will need to update the comp=AdobeAn.getComposition and the new lib.filename() to your filename. If you don't know where to find that information it is in the js that Animate spits out. Hope this helps someone. 

[kglad]

thanks you.