So it seems that Firefox loads the background images after everything else. I reorganized my site so the first image is not a background image and thus it seems to load first. Great news...but the other images continue to load at the very end. I intend to optimize them further but I don't think that is the issue.
http://www.nogginusers.com/eco/index.html
Related
In AS3 I am loading an image at runtime using loaderContainer.load(new URLRequest(nameofpic)). The image loads perfectly fine, but then I need to copy the image into a number (24) of MCs and this is where it gets tricky.
The problem is, I can run it perfectly fine in preview mode, got all the 24 copies, but whenever I try running it in Firefox or IE, the images aren't displayed. No errors, just blank spaces.
It works with images present when exporting, both on stage or in the library -- their copies are visible in both preview mode and in the browser, but the browser doesn't want to work with dynamically loaded images
I have tried the draw() method as well as bitmapData.clone and again, they seem not to work in the browser, while they're fine in the preview mode.
Do you know what causes the problem and/if there is a list of more of such bugs?
DB
This is really weird behavior. Having difficulty even quantifying. Have had to revise a few times.
Best I can do is the following:
The tech stack for my app is Backbone Marionette, handlebars.js, require.js.
The app contains images mostly of icon size - say 32x32 and under. Some jpg, some png, some svg.
Some of the images, the same ones each time, don't display. That's a common issue on which many have posted. No big news there.
But if I hit the sleep button, leave the iPad sit for a minute or two until the unit really goes into hibernate mode, and then revive it, the images slowly and magically fade in. They don't abruptly display when the screen lights. They fade in afterward.
Doesn't work to just hit the sleep button and instantly revive. Have to wait a minute until it truly hibernates.
After true hibernation, no matter how many times I refresh the page, the images are there. But, if I go and clear the cache on Safari and load the page, the images are not there again - until I do that hibernate thing.
All of these images do display without fail in a browser on a PC (all flavors). It's just on the iPad that they don't.
I thought, at first, it was just images I was loading in collection views. It is not. I have a third party HTML5 video player in the app. It has a play button and other controls in svg format. This also exhibits the behavior above.
Once the iPad has hibernated and been revived, the images fade in. Only clearing cache makes them disappear again.
There are no 404 errors when the images don't display (checked in dev console on a MAC). In fact, if I just tap the screen where the video play button is supposed to display, the player begins. So the button seems to actually be there, just not painted on the screen - until you do that hibernate thing.
Some images in the app always load no matter what. I'm looking at those images to see if I can note anything special about them or the code which renders them.
I tend to think it's not the images themselves because the very same images in a plain web page always display on the iPad. Also, that third party video player in a plain web page displays the svg play button and controls without fail on the iPad.
It's just in my app that the behavior occurs. So it's logical to think my app is where the problem lies. I just can't seem to find a common thread for the images that always work vs ones that don't.
Not sure what code I can even post here. I'll look and see what might make sense to post.
Definitely a problem loading images dynamically via the framework. They are there but do not paint. No idea what the problem actually is. Literally only happens on Safari mobile browser. Can't make it happen anywhere else, even old IE. Know one solution that definitely works though. Preload all the images by explicitly including them in a div in your markup. When you load your marionette app, remove the div - $("#preload-images").remove(). Thereafter the images never fail to paint when added dynamically via marionette.
For some reason when I use Chrome to test out my website, no images load at all, not even tiny ones like loading icons or the simple "back to top of page" arrow icon at the bottom. The browser tab just hangs on the spinning circle loading state. If I refresh it like 10 times or something then a portion of the images might load. Interestingly my Nivo-Slider images never load... there is a large empty space at where the Nivo-Slider gallery should be at the top left of my page no matter how many times I refresh.
The console is completely clean of errors if you check.
Can anyone check for me why my website is not working in Chrome? It works perfectly in Firefox/IE. I admit some images might have large file sizes but it shouldn't cause Chrome to hang for like half an hour?
I'm using latest Chrome/IE/Firefox. Windows 7 64-bit.
My website: www.symphonyofpromise.com/inspiration/en
By the way my website is a completely fictional museum/gallery project, it's not the official site for some museum!
I cannot be 100% certain on this, but judging from the Network panel, you might be loading too many MP3 files at the same time, thus maxing out the number of simultaneous requests. Chrome might use a different prioritization algorithm.
I would recommend removing some of those MP3 files and deferring loading until after the initial load.
EDIT:
Nevermind that, it appears that the MP3s load fine, but other resources are definitely blocking it. A request should never be pending this long. Poke around further in the Network panel and you'll find the problem.
I have this issue for a while and I want to know if it is just me or it is the way chrome works. When I make changes to an image and upload it, on reload chrome fails to show the new image, instead it shows the old image. Firefox shows the new image. This happens mostly with big images, like background. So I have to wait for a few minutes before chrome shows the new image... Is this a rule or it happens just with my browser?
This might happen because your local clock isn't synchronized with the web server. When you upload an image, a new file is created. The server will return the time stamp of the file when the browser asks for it. If that time stamp is older than what you have in your cache, the browser won't load the image again (assuming it's still good enough).
You should inspect the image (right click on it) and then look at the network activity. Chrome will tell you there whether it did load the image and why not.
Looks like it's caching issue. This logic is different for different browsers.
You can clear Chrome cach by pressing Ctrl+Shitf+F12 and set option "Empty the cache". After this action new image should load always.
In FireFox and IE, the images on this page load almost instantly (especially when they're cached by the browser).
But in Opera they load super slow. Even had to select one of them to "reload" to get it to appear. Can anyone see why this would be? Is it a problem with the webpage or how the images are served, or is it a problem with Opera settings? Been looking for image cache settings, but haven't really found anything that looks abnormal...
Here they load about as slowly in Chrome, but the animation seems to appear somewhat slower in Opera. I think the reason they load slowly is that all images redirect somewhere else - for example http://www.triangelos.no/u/10/thumb redirecting to http://www.triangelos.no/uploads/2012/05/4fc4028947b4b_875e059c43d1aaafab4db5afe569f10c.jpg_thumb.jpeg . Browsers are reluctant to cache redirects because they might redirect somewhere else next time, so you'll have to wait while each URL is re-checked before the actual images are loaded from cache.