Optimizing Flash file for Internet

[mRoy62]

I have a 10MB flash file that I have uploaded to my website. No idea if this is large or small for a Flash file! The Flash appears on my index.html page.  I have noticed that different browsers react differently, but when I open the page initially the video does not start playing straight away.

I'm using Dreamweaver. Is there a setting I should set? Any pointers?

Thanks.

[kglad]

that's very large for a swf file.

typically, a swf file would load larger assets like bitmaps, sounds and video.  there are times when you might not want to load all bitmaps and sounds but it's pretty unusual to realize any benefit from embedding video.

[mRoy62]

Not sure I fully understand your reply. I think you're saying that a 10MB file size for a Flash movi is quite large. However, the second part is confusing. Can you explain a little more?

[Guest]

kglad is suggesting that you NOT embed the video but just "point" to the video file that you want users to see. In this way, other content will appear sooner, whilst the video streaming process gets started.

[mRoy62]

I think I understand that, but never done it.

This is my current code:

        <div id="Video1">
            <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="300">
                <param name="movie" value="Images/Videos/ExampleWorks2.swf" />
                <param name="quality" value="high" />
                <param name="wmode" value="opaque" />
                <param name="swfversion" value="6.0.65.0" />
                <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
                <param name="expressinstall" value="Scripts/expressInstall.swf" />
                <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="Images/Videos/ExampleWorks2.swf" width="400" height="300">
                    <!--<![endif]-->
                    <param name="quality" value="high" />
                    <param name="wmode" value="opaque" />
                    <param name="swfversion" value="6.0.65.0" />
                    <param name="expressinstall" value="Scripts/expressInstall.swf" />
                    <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
                    <div>
                        <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                    </div>
                    <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </div>

Presumably I have to change these lines:

1.                 <param name="movie" value="Images/Videos/ExampleWorks2.swf" />

2.                 <object type="application/x-shockwave-flash" data="Images/Videos/ExampleWorks2.swf" width="400" height="300">

Rather than having ="Images/Videos/ExampleWorks2.swf" I'm guessing I replace with a url, correct? I'll look for some examples, but if you can offer something in the meantime I'd appreciate it.

Thanks.

[Ned Murphy]

No, the suggestion involves going into your ExampleWorks2.fla file and editing it to not have all the content inside it.  Make it so that the video file is loaded dynamically rather than having it imported into the library/timeline.  Similarly, if you have a lot of image files or large sound files, consider loading them dynamically as well.  Essentially, optimizing an swf involves minimzing the bulky content that it carries by loading such content dynamically as separate files when the swf is running.

[mRoy62]

I understand the principle. Will start to dig so I learn how to do this. Know of any sites / Youtube tutorial where I can get up to speed?

[mRoy62]

Re Dynamically Loading: I have tried various search for this infomation but can't seem to find anything that really helps. I realize it's probably too much for someone on this forum to guide me step by step (although that would be nice) but perhaps a link to a good tutorial would be helpful.

[Ned Murphy]

Can you describe how you currently implement the video in the file, inlcuding any code relevant to it?

[mRoy62]

This is my code as per what Dreamweaver creates:

This is my current code:

        <div id="Video1">
            <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="300">
                <param name="movie" value="Images/Videos/ExampleWorks2.swf" />
                <param name="quality" value="high" />
                <param name="wmode" value="opaque" />
                <param name="swfversion" value="6.0.65.0" />
                <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
                <param name="expressinstall" value="Scripts/expressInstall.swf" />
                <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="Images/Videos/ExampleWorks2.swf" width="400" height="300">
                    <!--<![endif]-->
                    <param name="quality" value="high" />
                    <param name="wmode" value="opaque" />
                    <param name="swfversion" value="6.0.65.0" />
                    <param name="expressinstall" value="Scripts/expressInstall.swf" />
                    <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
                    <div>
                        <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.g if" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                    </div>
                    <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </div>

I was having difficulty using Flash to create the SWF file so used something called Free Video to Flash Converter.

I'm guessing now that I need to create the SWF in Flash and somehow specify some streaming options. I probably sound pretty dumb here to you experts. Very happy to go up a learning curve, but not sure how to get on it.

[Ned Murphy · Accepted solution]

Yep (not the dumb part, just the Flash part)... You need to be in control of creating the Flash file if you want to optimize the Flash file.  Try searching Google using "AS3 FLVPlayback tutorial" for starters.

Creating a file without a tutorial can be as easy as dragging an FLYPlayback component onto the stage and specifying the video source in the properties panel parameters section, but following a tutorial may help you to understand things better.

[mRoy62]

OK. Thanks - and then once I've done that in Dreamwaever do I just go to the Insert>Media>FLV option and select streaming video. What is the difference between the streaming and progressive options?

[Ned Murphy]

I suggest you don't use Dreamweaver at all, except to copy and paste the html code that Flash will generate when you publish your file.  Flash can generate a variety of file outputs, one of which is an html page that will display the swf file that you create with it.  It is usually safer to use the code that Flash produces and not rely on Dreamweaver to create anything for it.

[Denclare]

I sure hope somebody's still on this thread...

No video but a similarly large Flash file - 10mb.

This is a web banner containing a waving flag (that stops after 30 seconds), a line of type and a small png photo that pop on, and the photo slowly creeps to the left during the 30 seconds.

I didn't create it, so I don't know the details but the client's IT guy is a bit concerned about the size and I can't find the designer.

I have access to the fies but am clueless about what to do.

Any and all help appreciated.