MovieClipLoader and Loader quirks with cached images

On a recent project I ran into a quirk/unexpected behavior when using MovieClipLoader in AS2 or Loader in AS3 to load an image. When using the classes, you have the ability to listen for a progress event, which you typically use to show an progress bar. If an image is cached, one would think the progress event would not fire since it should be fired on bytes loaded not bytes read, correct? Wrong. If an image is cached the progress event still fires, even to the tune of 9 times.

I would have not guessed this to be the case, and had even willingly drank the koolaid into believing all my load worries had been solved by these glorious classes. Instead I had to back peddle and use enterFrame checks for progress events and only use the onLoadInit/complete event from the class. All of this I found because a designer was getting upset because the progress bar kept showing up on loaded images. That’s right folks, the mantra here is “designers are your friends”.

4 comments

  1. duga

    thats right, designers are your friends, without them there would be more templated ugly blogs like this one and we would all be using linux.

  2. chino

    Usually we show the progressbar 0.4 or 0.5 seconds after calling the load method.
    So, when you load again from the cache, or if the loading is very fast, the progressbar is not displayed.

    Hope this helps.

  3. Kenny Bunch

    Chino,
    The way I solve it is with onEnterFrame in a component like UILoader. If you do checks for progress using it and test to make sure that you have positive values, it works cleanly. Delaying would work, but it doesn’t feel as clean to me. It’s probably a matter of preference.

  4. chino

    Yes two various approaches, same goal, same result, it’s just a matter of preference, and perceived speed versus real speed.

    Perceived speed is an important factor, if the loading time is below 0.5 sec, having no progress indicator “feels” faster than with some indicator as your designer noticed.
    And it’s always annoying to show a progressbar and hide it a few milliseconds after.

    By the way, I prefer delaying because it also solves the situation where you’ll have to load very small amount of data with a fast connection, wich will “feel” like loading from cache.

    You got an interesting point about bytes loaded returned by theses classes.
    Maybe the load progress event is fired with some weird values because even if your image is in the cache there is still some data exchanged between the browser and the server (to check if the image in the cache is up to date), but not sure at all, need some testing with different headers sent by the server.

Post a comment

You may use the following HTML:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre lang="" line="" escaped="" cssfile="">