How does the browser load flash files? Do they load progressively, or does the browser wait until the entire flash file is loaded before displaying it?
The reason is I have a tiny clip that is extremely high in quality, only a few seconds long, but it's over 4 mb.
Will the user have to wait until all 4 mb is loaded before viewing? Or does it load as the user watches it?
I didn't do anything fancy, I just imported a .flv into Flash, and exported as a .swf.
Thank you in advanced
There are many parts to loading a flash file, and more generically, an HTML page.
I'm going to start from the top with the HTML page, and I urge others to correct any mistakes I may have made.
Loading a Page
When an HTML page is received, the browser parses it into the Document Object Model (DOM) so that it has a programmatic representation of every element. Browsers iterate over every node in the DOM tree and populate it as-needed.
For most nodes this is simply creating a new DOM element like a div, p, or a; however some content requires loading or replacement.
form elements (input, select, button, textarea) are replaced with the browser-specific representation of those form fields.
link elements used as stylesheets are asynchronously loaded. The DOM continues to parse the page as the external resource is being loaded.
script elements on the other hand, are synchronously loaded. The DOM is unable to continue parsing the tree until the script has finished loading and executing, with exceptions for if the loading failed or the execution had an error.
img elements are asynchronously loaded, but allow for the onload callback to determine when they have finished loading. The DOM can't trigger the window's onload event until all img elements have finished loading (or failed).
Understanding the basic elements helps with understanding more involved elements like object, embed, and iframe, which are also replaced content.
Flash is typically embedded on a webpage using object, embed and iframe.
As far as I'm aware, object and embed elements react similarly so I will shortcut and say object from here on out.
There are distinct differences between loading flash in iframe and object elements.
The object element is very similar to a script element where the content must be successfully loaded and executed before the DOM can continue to be parsed.
The iframe element is very similar to an img element where the contents are loaded asynchronously, but a callback may be used to determine when the loading has finished (although I'm not sure about whether the callback is available for cross-domain requests).
Loading Flash
The previous section discusses just the HTML side of content loading. However, there are a number of nuances within flash that can severely affect the load time of a flash movie.
As I stated before, script elements must be fully loaded and executed before the DOM can continue being parsed. A similar effect is found within Flash files (even when included via an iframe). All resources embedded within the swf must be loaded before the swf can release its hold on the page loading progress.
If you've embedded a video directly into the timeline, the entire video must load before flash can be considered done with its initial execution.
If, instead, you chose to use an asynchronous callback to start loading an external resource that happened to be a video, and used an asynchronous loader to load the video, you wouldn't have to wait for the video to be finished loading before the rest of the page could be loaded; within flash, you'd still need to wait for the video to finish loading before beginning playback of the video.
Alternatively, there are a number of means within flash to either stream videos, or progressively load a video from a server, which would enable the video to be played without being finished loading. My experience with that particular aspect of flash is minimal, so I won't explain how it's done.
Using a library like swfobject allows the desired swf to be loaded asynchronously so that flash loading is non-blocking.
tl; dr:
Flash files may be loaded progressively depending on how you've structured your HTML, and what code is running in the swf.
You may want to look into swfobject
swf files are loaded progressively (hence loader bars, "50% loaded" messages and such).
Historically, Flash files are based on frames, and if the main timeline has multiple frames, they will be loaded and displayed in sequence, as soon as they are loaded, before the entire file is loaded. However, most Flash content nowadays is not constructed that way, and are more complex than a series of frames that are displayed in sequence. Video playback also adds complexity beyond the basic frame model, with video codecs, audio synch and such.
So the answer to the question "Do they load progressively, or does the browser wait until the entire flash file is loaded before displaying it?" is that they load progressively and are displayed before the entire swf files is loaded. But how this will effect how the users experience your video is hard to tell without seeing it or how it is constructed.
It will load the entire movie first. So make your video an external file that the movie loads when it runs.
Related
Please click on the below link
http://hpecp.vmokshagroup.com/videobook/html/homepage.html
When we click on "What is VideoBook" link we got some blank screen before starting the swf file due to video fetching from the server. We have to avoid blank screen.
We are facing a problem of fetching the video clips from the hosting server. I added two video clips in Flash (.swf)... one is from the beginning, another one is at the ending and in between some text animations.
While we are playing/calling .swf file in browser from hosting server, initially getting blank screen. It takes some time to fetching the video clip from server due to size. Starting of first video clip duration is about 3-6 seconds. While video is being loaded.. text animation is starting without playing first video clip. Same problem we are facing in second video at the ending.
Is there any option to incorporate video clips internally in Flash (.swf file) rather than calling from external server or external file path?
Any help would be appreciated.
This happens because of the JavaScript that you use - it actually makes the swf files (in)visible depending on the situation. What this does is that it actually loads the .swf files each time. You can check that in the Network tab of your debugger (I'm using Chrome).
So it first loads Video-01d.swf, or Video-02.swf. They take time to load, and just when the main file is loaded, it starts to load the video file (video1.flv).
All that causes delay, and it's pretty normal as you have all that things in separate files. If you want to, you can merge them into one - just import the flv inside your .swf file and it will work out well..
Of course, you will need to change all your logic for the flash files that you are playing. You will also need to change the JavaScript to call Flash functions in order to tell it to go to another "scene".
I will advise you to add a simple gif loader image (like this), put it as a background-image of the div, and put some color into that div. What the user will see is that the movie disappears, there is a black background with a loading symbol inside, and then the new video begins. It's a normal thing to see online - preloaders :) Good luck!
I have a rather complex flash clip that ends up bogging down the loading of the rest of my webpage.
Can I force the flash to wait to load until the rest of the site loads?
If you do not mind to have javascript you may use something like SFWObject 2 library, here is documentation page http://code.google.com/p/swfobject/wiki/documentation there is different methods for using it, so you just need pick up which is more appropriate in your case. Main idea you may trigger swf player initialization with javascript, so you could control time when this happen, and so using it just do that after onload event triggering. But assume problem cold be more complicated than just delaying your clip, so try to test it on different computers and browsers.
I have a simple expandable advertisement which loads an external SWF file. The external SWF file contains an embedded video.
Using the UILoader component, I have loaded the SWF, added it to the stage and the video displays and plays fine.
The main issue is that I have a close button, which should unload the video, and stop it, essentially returning to the default state of the advertisement.
To unload the SWF, I am doing the following:
myUILoader.unload();
removeChild(myUILoader);
When I do this, the video and UILoader disappear from the screen. However, you can still hear the sound in the background, and if I load the SWF again, it creates multiple tracks in the background. Any suggestions?
There are a couple of things that could cause this. One is that the content inside your UILoader is adding event listeners to outside of itself. You can fix this by not allowing it to touch anything outside itself. I believe you can do this by placing it either in its own ApplicationDomain, SecurityDomain, or both. Consult the help for more details.
If this is not feasible, you can try SoundMixer.stopAll(), which will stop the obvious symptom, but will not fix the memory leak you probably have in this situation.
Another possibility, as Ronnie has alluded to, is that you still have a reference to the content of the loader somewhere. If you don't clear that, it will stay in memory.
However, there is another problem that can also cause this, which is that if there is navigation in the movie that skips over a frame that contains a MovieClip with audio set to "stream," the MC will be created but not fully instantiated and will stay in memory with no way to get any control over it or release it. I don't think this is what is happening from your description. If it is, the fix is to make sure that you visit the frame that contains the sound, however briefly, on the way to the other frame. This is actually something you might want to consider even without sounds, because it does occur any time you skip frames in nested MovieClips (you just have no evidence unless you profile the swf), and over time this will create a memory leak.
So, hypothetical situation here:
I have an SWF that's 30MB. Sound files (music) make up 25MB, art and other things make up the remaining 5MB.
Would it be possible for me to load the 5MB of necessary art and other things first to allow the user to operate the app, then after that's all loaded and they are operating the app, load the remaining 25MB of sound files in the background?
UPDATE:
Loading SWF (or other entities) externally is not an option.
You can do this by modifying the compilation settings and strategically placing the sound.
By default, anything placed on the timeline will be loaded sequentially; the Flash Player will play the SWF as soon as the first frame is loaded. If you use the default compilation settings, all library content will be placed in the first frame, so the movie doesn't start until everything is available.
You can modify these settings, however, to allow for a more sequential load order: For each of your library elements, you can uncheck "export into frame 1" in the properties window. Now these elements won't be loaded, until they appear in the main timeline. This way, if you place your content carefully, you can allow for all important elements to be loaded in the first frame, or if you have a progress bar, until the main movie starts, while all streaming elements load with the animation, which has to be placed accordingly. Make sure though, that you don't leave anything out (by not placing it on the timeline), or call elements from ActionScript before they are loaded completely. It is very important to test this thoroughly, because if anything goes wrong in the load order, your entire SWF might stop working.
Also, remember that the SWF loads sequentially: If you have a sound in, say, frame 300, and another in frame 1000, the one in 300 will be loaded first. If you jump to frame 1000 from a menu in frame 10, you have to take into account that the frame might not be loaded yet. So there has to be some sort of checking mechanism (framesLoaded) and/or dialog to inform the user about additional loading time, and prevent the application from crashing.
I've got to (quickly!) add an intro to an existing flash masthead on a site that I've inherited. I don't have access to the source .fla's, so I approached the problem by putting the intro in a wrapper swf and loading the current masthead and adding it to the display list on Event.INIT. So far, so good. (Incidentally, the swfs are built for flash player 9 and use AS3.)
The problem I'm having is that although the intro plays fine and loads / displays the beginning of the masthead swf, which is a loading animation, the masthead itself never actually plays. Essentially, my question is: what would cause an actionscript 3-based swf to behave differently when it's the child of another swf as opposed to at the top level of the embedded swf?
Potentially important details: Embedding is being handled with swfobject, and no flashvars are being passed in. There are two params, which are base: "/flash/" and wmode: "opaque". All the swfs and flash data live in /flash/. The flash elements (minus the intro I built) were constructed using the Inky flash framework, with which I'm not familiar.
UPDATE: I've reconsidered my approach to the problem and gotten it working by using ExternalInterface; I'm having the intro swf call a js function when it finishes playing, which swaps out the intro swf and replaces it with the current masthead (the approach is outlined here). I'd still like to know why I was witnessing the behavior I was seeing earlier, though, so any ideas and suggestions would be welcome.
There could be a couple of potential problems with your flash files.
If your swf was compiled in AS2, it could be referencing _root which would be messed up when it is loaded into another swf. In AS2, you can get around it by using _lockroot. In AS3, this is not longer a problem because _lockroot is inheritted.
If your movie was a timeline based movie, you can try to invoke the play() function.
If your intro loads external assets, you will want to make sure your paths are set correctly for all your external assets. Try to put the swf file of your container and the intro in to the same directory. Or troubleshoot by using the Safari Activity window to see if you have any "404 not found".
Another thing is inconsistent flash version. You could run into problem if you load a Flash version 9 with a Flash version 10.
Hope these pointers help.