Adobe Animate loadMovie() HTML5 Canvas equivalent

[ruggles_nessman]

I’m an old sudden-newbie attempting to make the transition from Flash to Adobe Animate CC and learning about exporting my banner animations to HTML5 Canvas but it seems like the “industry” is in flux and Animate CC now caters to both Flash Users and HTML5 so I’m finding a lot of conflicting tutorials and advice. This makes my transitioning needlessly confusing. The fact that I am relearning all the HTML I forgot doesn’t help

So I have a couple of general questions that I hope this group can help answer.

In the days of old, When I made a rich media banner in flash, I’d have the initial swf that loaded the max file size for the banner (40k) and then upon interaction, load and unload external swfs or add elements from the library. How is this done though HTML5 canvas now?

This was the closest information I could find online:
https://forums.adobe.com/thread/2380614

And still can’t get it to work. So far I have just resorted to the age old practice of sending the playhead to a label after a button click:

this.btn_1.addEventListener("click", fl_ClickToGoToAndPlayFromFrame_4.bind(this));  function fl_ClickToGoToAndPlayFromFrame_4() { this.gotoAndPlay("video_1"); } 

Is there a more “dynamic” way to basically create a polite load banner? Loading images as needed into a “empty movie clip”

Also, optimizing the images confuses me now since they are exported into a sprite sheet. How is the initial load calculated? So does the entire image folder count towards the banner size?

I noticed when I used a complicated mask over a series over a multiple line pattern, the animation ran super slow. Do vector symbols no longer save file size? Does each line on the mask or bg pattern now get rendered through the browser? Is so, should I just use a image file like a transparent gif?

Sorry to appear so ignorant but…well there you go.

I really appreciate anyone taking time to answer.

[rosebudd · Accepted solution]

ruggles_nessman  wrote

Is there a more “dynamic” way to basically create a polite load banner? Loading images as needed into a “empty movie clip”

Also, optimizing the images confuses me now since they are exported into a sprite sheet. How is the initial load calculated? So does the entire image folder count towards the banner size?

I noticed when I used a complicated mask over a series over a multiple line pattern, the animation ran super slow. Do vector symbols no longer save file size? Does each line on the mask or bg pattern now get rendered through the browser? Is so, should I just use a image file like a transparent gif?

The answer is sometimes. We are no longer restricted to 40K, so the polite loading thing is less important. Sprite sheets is checked by default, but will not always result in smaller file sizes. Evaluate the file size of that sprite sheet image to decide. You do want to limit your creative server requests to about 5-7 files, so it is a sometimes yes, sometimes no decision. More often than not vector will be better, unless it is complex, like a snowflake. In that instance you are better off creating a PNG-24 and using Tiny PNG to optimize.

So does the entire image folder count towards the banner size?

No, just the size of your zip file, which is your images folder, the HTML and JS file. Your static image backup is separate.

How to prepare HTML5 assets for DCM - DoubleClick Digital Marketing Partners Help