Why Web Browsers Suck Today
-
I am working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations. During the vertical animation, it would pause for a fraction of a second whenever a new graphic came into view (making the animation appear less smooth). I surmised this was happening because the browser was loading the image into graphics memory (or from some cache into normal memory) and then unloading it after it came out of view. The solution, which seems to be working, is to combine all the images into a single sprite image and only display the portion appropriate for each section of the page (that way, there is only one image and it is always visible, so it always stays in graphics memory). Such a workaround should not be necessary (not to mention it increases overall file size and makes image management more complicated). :|
-
I am working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations. During the vertical animation, it would pause for a fraction of a second whenever a new graphic came into view (making the animation appear less smooth). I surmised this was happening because the browser was loading the image into graphics memory (or from some cache into normal memory) and then unloading it after it came out of view. The solution, which seems to be working, is to combine all the images into a single sprite image and only display the portion appropriate for each section of the page (that way, there is only one image and it is always visible, so it always stays in graphics memory). Such a workaround should not be necessary (not to mention it increases overall file size and makes image management more complicated). :|
Are you sure that's the case and it's not a delay in actually loading the image from the server to the browser? Are you pre-caching the images client-side when the page loads?
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
-
Are you sure that's the case and it's not a delay in actually loading the image from the server to the browser? Are you pre-caching the images client-side when the page loads?
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
I did scroll through the entire page first to ensure all the images were loaded. Then I repeated the scroll animation.
-
I did scroll through the entire page first to ensure all the images were loaded. Then I repeated the scroll animation.
Have you rebooted your machine?
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
-
Have you rebooted your machine?
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
Yes, hundreds of times since I bought it.
-
Yes, hundreds of times since I bought it.
That's funny because it works on my machine.
m.bergman
For Bruce Schneier, quanta only have one state : afraid.
To succeed in the world it is not enough to be stupid, you must also be well-mannered. -- Voltaire
Honesty is the best policy, but insanity is a better defense. -- Steve Landesberg
I am not a chatbot.
-
I am working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations. During the vertical animation, it would pause for a fraction of a second whenever a new graphic came into view (making the animation appear less smooth). I surmised this was happening because the browser was loading the image into graphics memory (or from some cache into normal memory) and then unloading it after it came out of view. The solution, which seems to be working, is to combine all the images into a single sprite image and only display the portion appropriate for each section of the page (that way, there is only one image and it is always visible, so it always stays in graphics memory). Such a workaround should not be necessary (not to mention it increases overall file size and makes image management more complicated). :|
any flock of browsers in particular? :)
Luc Pattyn [My Articles] Nil Volentibus Arduum
-
any flock of browsers in particular? :)
Luc Pattyn [My Articles] Nil Volentibus Arduum
IE and Chrome. Firefox actually seems to handle it well.
-
I am working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations. During the vertical animation, it would pause for a fraction of a second whenever a new graphic came into view (making the animation appear less smooth). I surmised this was happening because the browser was loading the image into graphics memory (or from some cache into normal memory) and then unloading it after it came out of view. The solution, which seems to be working, is to combine all the images into a single sprite image and only display the portion appropriate for each section of the page (that way, there is only one image and it is always visible, so it always stays in graphics memory). Such a workaround should not be necessary (not to mention it increases overall file size and makes image management more complicated). :|
AspDotNetDev wrote:
working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations
Why choose a webpage for such purposes? In the old days we would have written a nice little client application. Browsers are for browsing. :)
-
AspDotNetDev wrote:
working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations
Why choose a webpage for such purposes? In the old days we would have written a nice little client application. Browsers are for browsing. :)
Things like this work much better as marketing tools than client applications (note: that's not exactly what the website I'm working on does, but it has similar ideas). :)
-
I am working on a webpage that is heavy with graphics and has a lot of vertical scrolling animations. During the vertical animation, it would pause for a fraction of a second whenever a new graphic came into view (making the animation appear less smooth). I surmised this was happening because the browser was loading the image into graphics memory (or from some cache into normal memory) and then unloading it after it came out of view. The solution, which seems to be working, is to combine all the images into a single sprite image and only display the portion appropriate for each section of the page (that way, there is only one image and it is always visible, so it always stays in graphics memory). Such a workaround should not be necessary (not to mention it increases overall file size and makes image management more complicated). :|
I guess, you need a graphic designer to help you with those images. The larger the images are the more processing time it takes to load properly. :thumbsup: Rendering images I realize is important, I would compare images with font because each font has different load times. That's why most people use .gif formats. :cool:
Sir.Dre http://www.andorum.com