Click to Show Lecture Notes

Optimizing the Bandwidth

File Size       Publish Settings    Pr 1    Pr 2    Pr 3

Using the Bandwidth Profiler
In order to know how much adding sound to your files impacts download time, you could run the Bandwidth Profiler. Basically, you make a few file size reductions and then you use the Profiler to judge how much the changes helped. If you make another change, use the Bandwidth Profiler again to measure the improvements. The following Practice Session might help you understand how to interpret the Profiler's results.

Click for PR 1 Judging Download Times...Judging Download Times

Task: Use the Bandwidth Profiler to Judge Download Times

Follow these steps to see how the Bandwidth Profiler can help ;you assess how a movie might play over the Internet.

  1. Open the file "keyframing.fla" that you downloaded earlier. Do a Test Movie.


  2. As the exported .swf plays, select View > Bandwidth Profiler (Ctrl+B). (This option is only available in the Flash Player while you are testing.)


  3. The Bandwidth Profiler provides information while the movie plays, letting you view a graph from the data. Click the glasses to see the image.

    4. Running the Bandwidth Profiler


    Hide the Image
  4. Look at the first section of data, called Movie. This information is mostly a recap of the settings you can change in your source movie. Notice two more values whose numbers will vary: Size and Preload. (Later on you'll try to optimize this file).

    5. Note: Preload displays how many frames must "preload" (and how long that takes) before the movie will start playing. These estimates are based on the modem settings (found under the Debug menu).



  5. Select the Debug menu and notice the different modem settings listed. Change the setting and you'll see the download time change.


  6. From the Debug menu, select Customize..., which opens the Settings box. Here, you can modify the presets or create your own. Add an option for the common DSL bit rate of 256KBs. In the fourth field, change User Setting 4 to 256K (DSL) and the number in the bit rate column to 32000. Click OK.

    7. The Custom Modem Settings Dialog Box
  7. Select your new setting from the Debug menu. You should see the preload time reduce to nearly nothing.


  8. Select View > Show Streaming. The movie will start over, and you'll see a green progress bar move across the top of the graph. Try different modem rates to see how it affects the graph.


  9. Look at the View menu, it has Frame by Frame Graph selected. The graph shows a vertical bar for the file size of each frame's contents. A tall bar means a frame has more data. The red horizontal line represents the sustained data transfer rate the current bit rate can maintain. So in other words, if a frame's bar is higher than the red line, Flash may need to pause at that frame while it downloads.

    10. Frame by frame view in the Bandwidth Profiler

    Use the Bandwidth Profiler's Show Streaming option to watch how the movie will play. Analyze the movie frame by frame by scrubbing to view which frames are exceeding the red streaming limit.



    Hide Practice Session 1

You can use the Bandwidth Profiler's Show Streaming option to watch how your movie will play. In this fashion, you can scrub the movie frame by frame and see which frames are exceeding the red streaming limit. For your information, just because a vertical line is above the red line doesn't necessarily mean playback will pause at that frame. When it's possible, Flash MX will start to download frames before they are encountered. Since some frames have no changes viewed onscreen, Flash can start to download frames from later in the movie. Frames that have no visual changes don't take long to download; therefore, Flash can concentrate on downloading future frames. This behavior is a form of advance streaming.

The Bandwidth Profiler has an option to show such streaming in a graph similar to the Frame by Frame graph. Select View > Streaming Graph, and you'll still see each frame's vertical box in an alternating light and dark gray box presentation.

Try this, open the Keyframing file again and do a Test Movie, select View > Streaming Graph, and select Debug, 56K. The first 13 frames all take more than 1/12 of a second to download. But then in the time it takes to play frame 15, Flash can download more than two frames. As a result, the entire 60-frame movie is downloaded in the time it takes 25 frames to display. (Select View > Show Streaming for a view of this effect in real time.)

Click for PR 2... Improved Files from Bandwidth Profiler Improved Files from Bandwidth Profiler

Improved Files from Bandwidth Profiler

These steps walk you through a situation where the Bandwidth Profiler can help improve a file.

  1. Re-open the keyframing.fla file used throughout these lessons. Immediately determine the total size of the exported movie. All you need to do is run Test Movie and look at the data at the top-left area of the Bandwidth Profiler (press Ctrl+B if it's not visible). Write down whatever number you get as a reference for later.
    2. (The original file was 9,760 bytes).

  2. Close the movie that's testing. Select File > Publish Settings... and then select the tab for Flash. Notice the slider for JPEG compression is applied only to raster graphics, and this file none. (If this file had raster graphics, you would likely see that this change made the file smaller but lowered its quality.)


    3. The changes you'll make in these next steps will cause a difference—you're going to optimize the curves in every drawn shape.


  3. Click the Edit Multiple Frames onion skin option (so that you can select multiple frames). Now select the Modify Onion Markers menu and pick Onion All, (as seen directly below).

    4. The Modify Onion Markers Menu
  4. Finally, click the stage then do a Select All (Ctrl+A). With everything now selected, choose Modify > Optimize..., slide the Smoothing scale all the way to the right, and select both option check boxes, (also seen below). Click OK, and you should eventually see a message concerning how much optimizing took place. There should be about a 1/3rd reduction (in the number of curves).

    5. Optimizing the Curves set to maximum smoothing
  5. Do a Test Movie again and notice the improvement in the file size. It could be a couple of thousand bytes smaller. (Mine is now 8,165 bytes).

    6. The optimized results.

    Hide Practice Session 2

The last session shows that Modify > Optimize can often reduce the file size (simplifying shapes), you're still just in the stage of finding problems. So at this stage in your learning of Flash MX you realize the Bandwidth Profiler helps find the problems, but not necessarily fixes them. Something else worth knowing can be found by selecting File > Publish Settings. The next time you export the move (just do a Test Movie), you'll see an all-text version of the data from the Bandwidth Profiler appear in the output window. In addition, you'll find a text file (named similarly to your movie's name and in the same folder) with the same contents. This just provides a permanent record of the data you find in the Bandwidth PRofiler.

Finally, the Keyframing example still pauses periodically during the first 20 frames when simulating a 14.4 modem. If this is your target user and you can't find any other way to reduce the file size, you'll have to resort to using a preloader, which will load all or part of the movie to your user's hard drive before playing it. (See the next Practice Session to do just that).

Click for PR 3... Seeing a Preloader in the Bandwidth Profiler. Seeing a Preloader in the Bandwidth Profiler

Seeing a Preloader in the Bandwidth Profiler

This task has you creating a basic preloader to pause playback on the first frame until most of the movie is downloaded. Just follow these steps.

  1. Re-open the Keyframing sample file you've been working with again.


  2. Select Insert > Scene. Open the Scene panel and rename the new scene Preloader. (To rename it, just double-click the current name (Scene2) and then drag the scene order so that Preloader is on top).

    3. Adding a Preloader Scene to the movie.
  3. Click the first frame of the Preloader scene's Timeline and insert an extra keyframe (F6).


  4. Select the first keyframe, open the Actions panel, and insert an IF statement (select the plus button and find "if" under Actions > Conditions/Loops). Then type _framesloaded>20 in the Condition parameter. With the first line of the IF statement still selected, insert a Goto Action (under Actions > Movie Control) and type 3 in the Frame field. (Be sure to use the drop-down arrow from the Scene field and choose Scene 1). Translated, this means if more than 20 frames have loaded, the user will jump to and play frame 3 (where it will automatically go to the next scene and play).

    5. Setting the Actions for the Movie Preloader
  5. So that the user can see it preloading, place some text onscreen. With the text selected use the Properties panel to set the text block as Dynamic Text and type _framesloaded into the Variable field. This way the user will see the value of this variable change while the movie downloads. Make sure the Character Option dialog (accessed by the Character... button) is set to embed just numerals or the first frame itself (with all the font outlines) will take a long time to download.

    6. The Character Options for Dynamic Text
  6. Select frame 2 and insert another goto script gotoAndPlay(1).

    7. Adding the final script for the Preloader.
  7. Run Test Movie, and with the Bandwidth Profiler, select View > Show Streaming.


    8. Hide Practice Session 3

Notice in the session three exercise from above, that you didn't make the preloader wait for the entire movie to download. By simply waiting for most of the file to download, Flash will likely catch up and download the final frames in time to display them. There's no sense in making the user wait for everything to download.

File Size    Back to Contents    Publish Settings    Top

Page Updated on March 2, 2003