iOS5 Safari Kills Web Development With Super Caching - caching

Well all right, maybe it doesn't kill web development completely... but it's certainly irritating. =)
I have been testing a site recently using various desktop and mobile browsers. So far, the only one that has given me significant trouble is Safari running on the iPhone 5, which uses a level of caching beyond anything I have seen before that seems nearly impossible to get rid of, which I now call Super Caching. This Super Caching has prevented me from testing my site as I am unable to test any changes - not to the css style, back-end c#, front-end javascript, aspx design, nada. I have tried the following methods to attempt to clear the cache for this page (both separately and all together):
Close all tabs in Safari, then close Safari entirely (double tap home button, close Safari icon there)
Settings -> Safari -> Clear History + Settings -> Safari => Clear Cookies and Data. Checking the Website Data after doing this confirms there is nothing there and shows 0 bytes of stored data.
Shut down my phone completely (not just sleep)
Change the url to my site by appending garbage information like ?random=pleasedontcacheme&random2=123
Add code to my site to try and prevent caching... which of course doesn't work because these changes are never retrieved by the phone's browser.
In short, testing has become a small nightmare at the moment. While any tips for how to actually destroy Safari's obnoxious caching would be greatly appreciated, I am more interested in making sure that this does not happen during development in the future. So my question is, for the current Safari browser, what is the best way to stop it from caching a website?
So far I have added the following to the Page_Load of my site's default page:
HttpContext.Current.Response.Cache.SetExpires(DateTime.UtcNow.AddDays(-1));
HttpContext.Current.Response.Cache.SetValidUntilExpires(false);
HttpContext.Current.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
HttpContext.Current.Response.Cache.SetCacheability(HttpCacheability.NoCache);
HttpContext.Current.Response.Cache.SetNoStore();
Response.AppendHeader("Cache-Control", "no-cache, no-store, must-revalidate");
Response.AppendHeader("Pragma", "no-cache");
Response.AppendHeader("Expires", "0");
I have also seen others use meta tags, though they have been described as a bit hacky. (As found here).
I am still working towards a way to retake control of my iPhone's cache, but in the meantime, I would like to ask those who might be more experienced with this particular issue how well the above methods work for getting around the caching issue (during development mostly, but also good to know for future reference). Or, are there other solutions that have been found helpful for this browser/system combo?
Thank you very much in advance for any tips or advice. =)

Related

firefox developer tools compare to firebug / missing preview for ajax response

i know this question might get voted down and be closed but i have to put it out there
im windows user and i got familiar with firefox in the bad old days of IE reign
i love firefox specially after i become a web developer and started to work with wonderful add-ons
but recent changes has made me to move to chrome more and more every day specifically i have to mention death of beloved firebug
i hate the firefox developer console , it feels awkward and clunky and primitive compare to firebug and its not as user friendly as firebug
i have to ask , is it me or anyone else feels the same ? cuz i've searched around and it doesn't seem to bother anyone else !
here is what bothers me the most .... modern web apps rely heavily on ajax calls , for some reason i cant find preview for ajax calls response in the firefox developer tools ... i can see server response as code but not rendered preview of server response
and i say i cant find it becuz i cant imagine possibility of not having preview .... just imagine your using a framework and it returns a stack error with lots of html/css style , its impossible to find the actual error among the heap of codes in developer tools response section
so aside from the rant , basically im hoping someone to say there is a preview and this is how you can activated it !
Unfortunately, the preview for responses got removed in Firefox 55, obviously under the incorrect assumption that it duplicated some other UI.
Luckily it was added back for Firefox 59, now placed within the Response panel.
Here's a screenshot for how this looks like on this page:

Chrome pending on images, javascript streamlining?

There has been very little changed to this page since it just recently stopped loading properly on Chrome.
If you click the link three times things usually load up fine. I've looked through the developer tools and can see that it's hanging up on the js the first load. The second load has pending on most/all of the .jpgs, and then finally another click/load works.
I know it's a heavy site, but the other pages are fine, in terms of actually loading and not just going idle, and this loads well enough in Firefox. I don't think this site is even the largest of the pages in terms of images and video.
I've gone through others solutions to this problem by changing the "https" and renaming files incase an adblocker was causing it, but nothing seems to work.
Any idea of what in the page is causing the issue?

Preventing Mobile Safari Cache Overflow

I've got a simple little web app that's aggregating a couple views from some ethernet enabled cameras around my house. This is basically a little dashboard, so that I can easily tell what's going on around the house. I've got it refreshing the images every so often by appending new Date().getTime() to the base URI.
Everything works happy days, except for one little issue. If I leave the dashboard up on my iPad for awhile, it runs out of memory and crashes back to the home screen. I know that its because Mobile Safari is caching each of these images in RAM and it eventually ends up with far too many of them.
Since these images are being hosted on embedded devices; I really have no ability to modify the caching headers directly. I would like to stay away from making a wrapper on my server side as well.
My question is; can anyone think of a way to prevent Mobile Safari from caching these images so aggressively that it crashes?
You might try to reuse your img tags and/or set the src attribute to an empty string before removing an image. It's probably not an aggressive cache that's crashing mobile safari, but how the browser doesn't deal well with releasing image references when image tags get deleted.
You might find more useful information here:
http://www.vargatron.com/2010/08/ipad-html5-js-memory-management/

Communicating with users on other web pages

This question is part user experience, part engineering.
I am trying to find a nice, clean way to have a user communicate with my web page while they are on another web page. I have web services that will accept HTTP POST/GET, so AJAX and other asynchronous niceties are welcome - don't worry about the details of their communication, they can easily be modified to fit a solution.
The problem I'm running into lies within the user interaction. Ex., say the user is viewing a web page and they want to send my system the web site's URL. I would like it if they could do it while still looking at that page, and without too many "crazy clicks" - currently they have to go back over to my page and enter the information (as you can imagine this has tested horribly).
I have ruled out browser tool bars (easy to do in FF, but a lot of my users use IE) and local applications (they won't want to install Java or Adobe Air apps).
Have you ever solved a problem like this before, or do you have an idea of how I could solve it? Should I be looking at separate solutions for FF and IE (ex., a tool bar for FF and something else for IE)? Don't worry about Safari and Chrome, though a solution that supports them too would be nifty.
Thanks.
p.s. The user would have an account on my system already.
Have you thought about something like the Digg Bar?
Users can access it through a bookmarklet, or you can do a url prefix like http://yoursite.com/<other_site_url>. When users click links, the bar stays active.
What if you wrote a system tray application. Something similar to Pixel Ruler
This could sit in their tray, and it would know you're website. That would eliminate browser toolbars, and could conceivably work on several browsers. You could probably even set it up as an install if they visit your website.
Then you could expose a webservice on your site that this control would pass back info to (like the user's name, current website, etc)
I don't know about the details of your application, but the only solution I can imagine is that you have a page split into two frames, with your toolbar at the top. stumbleupon.com does this, but it makes sense because they're providing the web content.
Simply, your users would have to visit your site before they could do their own browsing. Is that reasonable for your project? That sounds like it could be a user experience disaster of its own. Also, if most of your users are using IE, I'm going to assume that they're not the most web savvy users out there.

IE8 is suddenly refreshing entire window on page change/refresh

After my Vista 64 was updated via Windows Update to include upgrades to .NET, graphics, etc. (basically, pieces of Windows 7, I believe) Internet Explorer 8 has been doing something very annoying on many web sites. It's very noticeable on some sites I've built.
When the page is refreshed or another page - even from the same site - is loaded, the entire window refreshes itself as though it was loading for the first time; very disruptive. It's really noticeable on sites with darker backgrounds such as http://www.northridgecommunitychurch.com, but it's also noticeable here on the stackoverflow.com site.
Is anyone else noticing this? Can a developer do something - or stop doing something - to restore the smooth page transitions I was seeing until a couple of days ago?
Thanks in advance.
Just to add to my question, there is no trace of this problem in Firefox or Opera. Only in IE8, and only there in the past day or two.
Nevertheless, if anyone has any ideas for code modifications that might overcome the problem before clients start complainining....
You'd see much less flicker if the site was using HTTP Expires & Cache-Control headers properly; see http://www.fiddler2.com/redir/?id=httpperf

Resources