Skip to main content
Known Participant
April 1, 2019
Question

HTML5 file from Animate making web browsers crash

  • April 1, 2019
  • 2 replies
  • 757 views

I've been working on a kind of animated interactive page that has navigation from frame to frame using basic HTML5 Canvas Timeline Navigation ActionScript. It only uses the Stop At This Frame action and Go To Frame and Play (among some basic transformation animations), nothing too complex, and yet when I publish my file it was over 3MB which I've been told is quite big for a HTML file. I went in a clear loads of blank lines in the script and made sure it was using spritesheets for the images etc and that helped reduce it down to 2.4MB. Yet still when I open it in Firefox I get through a couple of pages and then it crashes or just lags so much it's bordering unusable (I can only open it in Firefox because Chrome had awful security issues and wouldn't let me access local files).

Are there any ways I can easily reduce the file size/stop the lagging when I open it in a browser? I'm relatively new to Animate but didn't think I was doing anything that complicated/taxing on the software.

This topic has been closed for replies.

2 replies

Legend
April 1, 2019

You aren't using static text, are you?

Known Participant
April 1, 2019

Yes, for the most part - anything I wanted to have motion/to transform I converted to a symbol beforehand

Legend
April 2, 2019

Static text and symbol text are not even slightly the same thing. Those are two separate things that text can be or not be, independently of each other.

kdmemory
Inspiring
April 1, 2019

Hi Ben

This might be just a lazy slip, but "HTML5 Canvas Timeline Navigation ActionScript" doesn't exist. Either is is Actionscript and you publish to *.swf format for the Flash Player, or it is HTML5 Canvas with CreateJS Javascript code.

Anyway, are sure you haven't used Actionscript snippets in an HTML5 Canvas project?

Then "(I can only open it in Firefox because Chrome had awful security issues and wouldn't let me access local files)." - yeah, it is actually better to not to open your Animate HTML5 output from a local place, meaning under the file:/// protocol. Animate itself sets up a local server when you test your creations. They are Open Source tools avalable to set up a local server on your computer and Chrome would stop moaning.

The filesize issue depends very much what you are doing in your HTML5 Canvas project. Look out for

  • Publish Settings: Export document as texture (might make a big difference)
  • avoid frame-by-frame animations, if possible
  • avoid motion tweens, make classic tweens
  • avoid complex shape tweens
  • if you have lot's of texts, use webfonts

That's all I have time for now

Klaus

avid_body16B8
Legend
April 1, 2019

Worth to mention - publish as texture is new to ANCC 2019.