#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31

    Do browsers automatically delete cached flash elements when not in use or full?


    I have about 50-100 flash elements on a page which are audio players that play only one audio each that are different from each other.

    Whenever a user clicks one of the player buttons, the audio either streams or loaded as a single mp3.

    I would like to know how browsers handle swf or audio that is on a page. If 50 of the players are clicked at 10mb each and not all at once, then I can imagine that there would be 500mb stored in the browser eventually as cache.

    If the browser only has 100mb to cache, how does it work? Does it delete the other swf or audio in cache or does it cause issues to the browser such as crashing or slowing down the computer, etc.
  2. #2
  3. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    I always assumed that the oldest content will get deleted from the cache as newer content is added to the cache. My default IE9 cache is 250MB. My hunch is that it's a bit more clever than FIFO (First In First Out) depending on the browser, so some filetypes may be cached longer than others.

    You've got to remember that the cache is used to re-load objects the next time the page is loaded. If you click 50x10MB files in the same session then they will all be loaded into memory to actually run. So you may only actually have half of them in the cache but all of them will be in memory, until you navigate away/close the window. So on a low-end system loading all 50 files may bring the system to crawl as you may be taxing it too much. This is why you'd have a single small audio player file and then stream the audio. That way, it's not caching any of the audio and the memory usage should be much lower. Also, caching will then not be a problem at all.
    Quis custodiet ipsos custodes?
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    Tann, this is probably what is happening now then.

    Correct me if my assumption is wrong.

    I have my 100 X 1 song little audio players that appear on a page.
    When a user clicks any of those little audio players, it loads using getURL a song.swf into it, which has streamed timeline audio in it. This means it has to load the whole song.swf for it to play.

    I am noticing that after hitting say 30 buttons, that some of the little audio players have disappeared when the page is refreshed.

    Is this because, the browser has decided to delete unused audio player swfs?

    eg.
    Player 1 -> loads 50mb swf
    Player 2 -> loads 30mb swf
    Player 3 -> loads 80mb swf
    Player 4
    Player 5

    Browser limit for example is 120mb before it starts deleting unused flash elements.

    The user clicks Player 1, then 2, then 3 and because it has reached the browsers limit of 120mb, then Player 1, 4 and 5 disappears.

    Is this correct on how the browser is handling the swfs?

    Besides using live streaming, is there a solution to prevent this from happening? I need to load swf to show samples of how audio quality sounds like streamed using timeline.
    Last edited by rePete; February 8th, 2012 at 06:27 PM.
  6. #4
  7. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    I'm not sure if that is why they are not displaying when the page is refreshed, could be. I didn't think the cache size would affect what you can see on screen since what is on screen is loaded into memory. My suggestion is that you clear your browser cache and open the cache directory so you can actually see what is in there. Then load the page and refresh your cache directory to see what has been downloaded. Then try playing a few of the files and see what happens with the cache directory. Finally, try refreshing the page and see if the small players are re-downloaded, that is, if they were ever erased from the cache directory.

    I would of thought that if you viewed 500MB of files and then refreshed the page it would still re-download the smaller files since those are called from the markup. It's hard to say and really I am just guessing. Doing the cache directory testing like I described would give you a better idea of what is happening.
    Quis custodiet ipsos custodes?
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    That sounds logical.

    O.K. I am using FF Web Developer Web Console.

    I load the page once, which is slow. It loads all the flash elements.

    I go to a different page and come back and in the console, it doesnt show loading of any of the flash elements again but there is a very long pause before images and flash elements appear. The browser loading symbol spins while this long pause happens.

    I am thinking, could it be the database or server having issues?

    Tann, have you even encountered a long load delay before it loads a Flash website or a CMS website that has Flash elements?

    Test result:
    When I click on player A, it shows on the console the audio.swf loading into player A.

    I go to another page and come back and click player A again, it shows no loading of audio.swf into the player so it must have kept the audio.swf in the cache or memory.

    Now I clear the cache, refresh the page and it reloads all the flash players onto the page as listed in the web console.

    I click on player A and it loads audio.swf into the player. So that means clearing the cache cleared everything and all the flash players will be empty.

    I can only presume that this must be a server communication or database issue??
    Last edited by rePete; February 11th, 2012 at 02:06 AM.
  10. #6
  11. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    I doubt it is a database issue but that really depends on how you are using your database. I don't remember you mentioning a database until now. If the Flash files are each talking to database then I'd still expect the non-Flash page elements to load since the SWFs themselves must of loaded to call the database in the first place!

    The delay could be caused by a slow local hard drive, it could be taking it a while to load 500MB into memory. How much data is it loading? You refer to the loader SWFs as small so I'm assuming you mean around 100KB. So if you have 50 of them, and they are each unique i.e. not the same SWF with different paths passed in via FlashVars for example, then that would still be 5MB. Not a lot to load from your local hard drives cache. Still quite a bit to download though for a first time user.

    How long is the pause and is it repeatable, like does it happen every time you follow the path you described? Do you get it in other web browsers?
    Quis custodiet ipsos custodes?
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    The page that contains all the flash elements is a Wordpress page. The Flash does not use the Database.

    The audio players are very small, only 3-4k in size X 100. The audio.swf that loads into it are between 500k-3mb.

    Maybe its the flash element code that is slowing it down.
    This is what happens:

    I go from one page then to the flash element page and theres like a 6-8 second loading delay, then all of a sudden the page will appear minus the 100 flash audio players. Then about 8-10 seconds later, the 100 flash audio players will appear sporatically on the of the page till all of the flash player appears.

    If I only have 10 players on the page, loading the page time is better. I may have to rebuild the flash player like you suggested, minimizing the amount of flash elements on a page. I may just make 10 flash players with 10 buttons in each player that will load each audio.swf when pressed.
  14. #8
  15. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    Well, using a single loader clip and passing in the path to the external content would mean you could have a single 3KB clip, but multiple instances of it. So you'd only have to download a single 3KB file instead of 300-400KBs spread amongst several files. Saying that though, 300KB is nothing, I could of downloaded that before I finished typing this sentence! If the players are not downloading the larger track data until the user clicks play then that probably means it probably has nothing to do with the cache being maxed out.

    It could be that you're hitting a limitation of the server itself. Servers tend to only allow so many connections per client at any one time, so if you are downloading 10 files it will actually do 2 at a time until complete. I just picked those numbers out of thin air, it depends on the server setup. Checkout this search for more info on that.

    One way to test the above theory out as well as tell if it is something to do with WordPress is to make a static HTML file that loads in the 100 players. Run it on the same server and see how that behaves. Then try the exact same thing on another server.
    Quis custodiet ipsos custodes?
  16. #9
  17. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    Good options Tann!

    I am also considering doing this. Adding a button at the start so that the user can select whether to load flash elements or not onto the page. I found this code, but it seems like it still loads the flash elements but just makes it invisible.

    Code:
    function showHide(id) {
    var obj = document.getElementById(id);
    // in css set visibility: hidden 
    obj.style.visibility = (obj.style.visibility=='hidden')? 'visible' : 'hidden';
    // or with the display property: 
    // in css set display: none */ 
    // obj.style.display = (obj.style.display=='none')? 'block' : 'none';
    }
    Do you know if it's possible to create a button on your html page where it asks, load flash or not and if not, it will not load the flash elements on the page.

    I was thinking of a javascript button that will write to a variable. The page will look into that variable and then decide whether to load the flash on the page. Do you know of anything that can do this? I have searched and so far no luck. All it mentions is disabling flash through the browser options or addons.

    I was considering making two pages, but that is not an option with my current skill level.
  18. #10
  19. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    Tann, I checked that link you provided and will try separating my sets of files into subdomains such as a js.sample.com, images.sample.com, flash.sample.com to see if I can get more download connections.

    I read though in some articles that it's not good to increase the amount of connections for downloads.

    I also tried using Chrome WebDevelopers tools network on the browser to see the timeline of how elements are loaded when you go to a page.

    I am noticing large unexplained jumps in loading on the timeline.


    Its like an empty gap in time, that starts from when the page is found and loaded to when the player.swf is found and starts loading.

    I also get that empty gap from when the page is found and loaded to when the scripts and css are found and loaded. It must be this so called connection thing, do you think?

    These gaps occur even when the elements are cached or freshly loaded as stated in the timeline where the elements are sourced from.
    Last edited by rePete; February 13th, 2012 at 03:20 AM.
  20. #11
  21. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    It does sound like it could be a host problem. Have you tried it from another location just to be sure it isn't your own connection? The connection limit would not give you loading gaps like that, it would just mean that files 1&2 would be downloading, as soon as they are done 3&4 start, then 5&6. Well something like that, it could vary depending on the size of the files. For instance, file #1 might be tiny so that finishes before #2 so then #3 would start at the same time as #2 was still running. Basically, you would always have the maximum connection limit count of files downloading, no big gaps.

    The process is:
    • You type an address into your browser.
    • Your browser contacts the server and says "Send me the default file for this address". That would usually be a HTML file like index.html.
    • The server then responds by sending that file back to your browser.
    • Your browser downloads HTML file and starts processing it.
    • As links to other files are found, CSS, JS, images etc, your browser sends a command to the server for each "Send me the file xxx.yyy". It does that for each of them in the order it reads them from the HTML file. That's why on some JavaScript intensive sites they put the JavaScript at the end of the file, so the rest of the site can load instead of leaving the user waiting on a white screen while all the JavaScript is loaded.
    • Something else to note with the last point is that your browser has its own connection limit meaning that it will only try and download X number of files from the same location at the same time. The rest are placed in a local queue. As one file finishes downloading the next one is taken from the queue and the request for that file gets sent to the server.
    • The server then responds by sending the file back. Servers can also have their own concurrent connection limits. It may be worth looking at the documentation for your server software to get an idea of what these values are set to.

    Something else to look into is server side compression. I had a problem last week where I had enabled gzip compression on a site. It worked fine for me on Windows with Chrome, FF, IE and Opera but it did not work properly on Mac OS with Safari. Each time I made a change to the site the page would not load until you clicked refresh. So the first time you visit you got a white screen, then you tap refresh and then the page would load. Had to turn gzip compression off to resolve that. There's probably a bunch of proper ways to solve that but since compression wasn't that important for the site, since it's a small site, it was easier and quicker to just turn it off. I just found a nice gzip tester now, see what it says for your site. I'm just wondering if maybe the act of zipping the data is causing the delay, I doubt it but since we're plucking ideas out of the air (^_^)

    If you use swfobject then the "dynamic" embedding option means that the SWF code is written by JS. That means you could wrap that code in a function i.e.
    Code:
    function showHide()
       {
          swfobject.embedSWF("myContent.swf", "myContent1", "300", "120", "9.0.0"); 
          swfobject.embedSWF("myContent.swf", "myContent2", "300", "120", "9.0.0"); 
          swfobject.embedSWF("myContent.swf", "myContent3", "300", "120", "9.0.0"); 
       }
    Until the user clicks the "Load Flash" button they would just see the plain divs that the Flash content would replace. The actual SWF loading does not happen until the swfobject.embedSWF function is called, so no unnecessary file loading.
    Quis custodiet ipsos custodes?
  22. #12
  23. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2006
    Posts
    660
    Rep Power
    31
    I contacted the host to investigate the issue and they say that its working o.k. and actually loading up pretty quick, so I decided to use those loading time test web pages online like http://tools.pingdom.com/fpt/ so that my internet connection will not be dependent on the test.

    But the test does not include the Flash elements in the loading time so I am not getting a proper result. The website does state that it also includes Flash elements in their timing, but it does not work??

    There are no gaps in the test results, but it has been replaced with yellow waiting blocks instead.

    Do you know any loading time testers that include everything on a webpage including the Flash elements?
    Last edited by rePete; February 14th, 2012 at 12:32 AM.
  24. #13
  25. No Profile Picture
    Gotta get to the next screen..
    Devshed Supreme Being (6500+ posts)

    Join Date
    Nov 2003
    Location
    Legion of Dynamic Discord
    Posts
    6,675
    Rep Power
    3164
    You can try using Fiddler to do that. It's free and you run it locally. Make sure to clear your cache first as it does not show things that are loaded from cache. The "Statistics" tab is pretty useful for both individual files and when you select a group of files, gives more info with the former. Also, try selecting all files and then viewing the "Timeline" tab. Maybe you can PM the link so I can check things out from here.
    Quis custodiet ipsos custodes?

IMN logo majestic logo threadwatch logo seochat tools logo