I am in charge of developing and maintaining several website on client-side. When it comes to temporary storage, I always think about localstorage in the first step. It is a fantastic feature which is introduced from html5 and it help me conquer many tasks for a long time.
However, it doesn't perform so well on private mode of safari browser. Precisely, it will broken when calling localstorage.setItem(...). So every time I use localstorage, I need to do some workaround only for private safari and it is depressing.
I am just curious why private safari does not support it? Is it really a big deal for making such feature compatible with current version? After all, we have a 95.37% support from modern browser now. (I know merely about the inside of modern browsers so if it sounds stupid please just ignoring it)
I am also looking for alternative solution which support all modern browsers.
Any suggestions?
thanks.
Related
Hi all thanks to help me,
I need to know all version number of internet explorer using java script, I need this because my site need to support a component that MS fix and for instance in this IE build number 11.0.9600 I not get that feature but in 11.0.9700 yes, so my website have to know about that.
This can be possible using javascript?
As James Thorpe already mentioned in his comment, browser (version) detection is not a good idea. In many ways.
First of all there is the question about privacy of your visitors. You shouldn't detect more than absolutely necessary. Anyone can set the information about his browser anyway to whatever he wants. So it is also less than reliable. A good and secure setup for browsing anonymously will not reveal browser version informations. You could say of course, someone using IE ... but let's not open that can of worms.
The better way is feature detection.
The idea behind feature detection is that you can run a test to
determine whether a feature is supported in the current browser, and
then conditionally run code to provide an acceptable experience both
in browsers that do support the feature, and browser that don't.
If - for example - you want to know if your visitors browser supports HTML5 Canvas, you can create an element in memory and then check if a property exists on it.
function supports_canvas() {
return !!document.createElement('canvas').getContext;
}
if(supports_canvas()) { ... }
Your can learn about feature detection here where the quote and the example comes from.
I have a working sample with IndexedDB that works perfect for my Desktop Chrome. Nevertheless, my main aim is to develop for iOS devices (Chrome-Safari) and this API isn't available there yet.
What should I do?
I have seen this Polyfill: http://nparashuram.com/IndexedDBShim/. But, I tested it with my iPod Touch 5th Gen and somehow the 19th test doesn't work...
Should I use WebSQL which was deprecated?
I liked the idea of the Polyfill but that it not working for me...
Are there any plans to support IndexedDB in the future for all the non-supported browsers?
Thanks!
Here is another similar polyfill you can try, but in my (albeit limited) experience, both polyfills are buggy/incomplete. They both also have many open issues on GitHub of people reporting problems. And when I tested one of them (I forget which one) it was significantly slower than native IndexedDB.
Maybe it's possible to create a decent polyfill, but the current ones don't seem to be doing the job.
Should I use WebSQL which was deprecated?
The problem with WebSQL is that it's never going to be supported in IE or Firefox. You could probably get away with WebSQL if you're only targeting mobile browsers, at least until Firefox OS or Windows Phone grabs significant market share.
Are there any plans to support IndexedDB in the future for all the non-supported browsers?
Let's be clear. You're asking about Apple, since everyone else supports IndexedDB in their latest browser (iOS Chrome uses Apple's rendering engine because Apple won't let them do anything else).
Not only does Apple not support IndexedDB, they haven't publicly said anything about it (as far as I can tell... and I have done a fair amount of searching). Which seems pretty weird. So as best I can tell, nobody has any idea if Apple ever plans to support IndexedDB. The conspiracy theorist in me thinks maybe they're trying to sabotage HTML5 apps to force people to write native apps, but that's purely speculation.
In total, this leaves us developers in a pretty shitty situation. There is no good cross-platform solution. I recommend you complain to Apple about it. That's what I've done, and I've asked my users who want to use my IndexedDB-based app on iOS to do the same. Still no word from Apple.
UPDATE - Indexeddb is now supported in iOS 8 as stated in WWDC 2014 - but unfortunately it's broken pretty badly.
Looks like IndexedDB is not working as web app (pinned to the home screen).
Works inside Safari.
IndexedDB was never be made to be directly used by developers. It is more like an API that can be used to build a "real" database on top of it.
Nowadays there are many alternatives that you could use instead.
NeDB used heavily, but deprecated
PouchDB
RxDB
If you still need to use IndexedDB, at least I would recommend to use a wrapper like dexie.js which at least makes it easier.
One of the requirements of one of my clients is to show a message to a user that's using an older version of Firefox, Chrome, IE or Safari. For the last two it's easy (IE 9+ and Safari 5+). But for Firefox and Chrome, the requirement is that the site supports the current and the previous version of each browser.
To get the clients browser and version is quite simple, but I need to know what is the last version of each browser. Is there any way of doing that?
Well, technically, all you need is a place that keeps track of what the latest version of each browser (Ideally with a web service).
A quick Googling I was able to find: http://www.webdevelopersnotes.com/articles/latest-browser-versions.php
It's not a web service, but you could simply parse that HTML and get the latest version of each browser. Alternatively, you could keep track yourself and manually update this information in your database.
You should only ever have to worry about IE when it comes to version enforcement. Exception being, of course, if you need a specific API that's just not available in previous versions of Chrome/Firefox, but in that case you'd look and enforce the API, not the browser version. Adding to that, if Chrome/Firefox don't have an API, chances are even the most bleeding edge version of IE won't either, so the point is moot. The fact is Firefox and Chrome, and in part Safari, are far ahead of IE when it comes to browser hosted capabilities that trying to enforce specific versions of the former would likely be a lot of wasted time and effort to yield nothing substantial.
The best I could find was this. It has an export option that allows to export in JSON, XML...
I would strongly suggest that you don't check the browser version, instead try doing feature detection using, say, Modernizr.
What features of your client's site depends on specific versions of each browser? If you use Modernizr you could perform a check on a feature, say some video stuff, and if the current browser does not support that feature, then display a message to the user suggesting they upgrade their browser.
Detecting browser versions via Javascript is very flakey at best.
The only reason I'd say you need this kind of verification is because your webpage has features only available to latest browsers. Instead of relying on version numbers, I suggest learning Modernizr.js for your website.
http://modernizr.com/
It can detect particular html5/css3 features individually.
So I am writing and app with meteor.js and I try to show it to somebody with an ancient browser. The site is all screwed up, probably because of a mix of unsupported CSS, javascript, and html features.
What is the best way to kick anyone to the curb without a moderately modern browser (IE9+ etc...)??
And before we get ahead of ourselves
Firstly, I have no desire to do feature detection (I have no idea what features meteor requires although I see some suggestion it might even work on IE6)
Secondly, I have no desire to test on outdated browsers (so even if feature detection would work I don't want to put in the effort to ensure that it works across any more than the latest browsers)
Thirdtastically, Is it so wrong to just not want to put in any effort to support older browsers and to have no sympathy for people with them?
Are there any JavaScript wrapper scripts available that can use HTML5 JavaScript features if they are available (e.g. locaStorage / Web Storage / anything in common between Google Gears and HTML5), falling back to Google Gears if the browser is not capable (e.g. IE6 or IE7)
While it would be ideal that IE7/6 users all move to IE8 (or Chrome, Firefox, Opera), they will still be around for years to come (maybe IE6 will not last as long as IE7, but IE7 lacks any real JavaScript changes).
For feature detection I think most here would recommend the excellent Modernizr. Of course you'd still have to write the Gears part yourself, but that really isn't very hard - just a secondary test after Modernizr reporting back that the features you're looking for isn't available, or creating your own test with the addTest() API.
It comes across as a little odd that you're trying to use Gears as a fallback for those HTML5 components - as far as I can tell, Gears penetration is very low, so it can't really be an reliable fallback for those. Although the functionality is similar, the syntax isn't, so you really are going to be writing twice the amount of code for something that's unlikely to be used.
While I don't know of such wrappers, one can use the old failsafe:
if(typeof SomeAdvancedFeature=='undefined')alert('Dude, get a real browser!');
http://www.phonegap.com/ (from what I've been able to divine so far - this uses native code)
https://github.com/zefhemel/persistencejs
http://code.google.com/p/webstorageportabilitylayer/
http://www.modernizr.com/