Yikes! I've been a developer for many years and have always tried to emphasize code that is compatible with as many systems as possible.
Recent, I purchased the book jQuery in Action and started reading it. I am very disturbed by the fact that the included source code doesn't appear to work correctly on either of the browsers on my current computer.
Specifically, I downloaded the book's source code and selected the "jQuery Selectors Lab" for Chapter 2. But it doesn't look how it does in the book.
On Google Chrome, both the DOM Sample and DOM Sample Code panes are completely empty. On IE7, things appear much closer to how they appear in the book. But the source code in the DOM Sample Code pane is all on one line (which extends to the right, off the page). Note that the screenshots in the book are of a browser running on the Mac.
I'm curious what sort of cross-browser compatibility users more experienced with jQuery are finding, and what this revelation means for developers who like to be as compatible as possible and are planning to use jQuery.
jQuery is actively supported in all these browsers:
Firefox 2.0+
Internet Explorer 6+
Safari 3+
Opera 10.6+
Chrome 8+
There are known problems with outdated browsers as per the list below:
Mozilla Firefox 1.0.x
Internet Explorer 1.0-5.x
Safari 1.0-2.0.1
Opera 1.0-9.x
Konqueror
jQuery generally works with Konqueror and Firefox 1.0.x, but there may be some unexpected bugs since we do not test them as regularly.
If you are using any of the outdated browsers, then this could be your problem, otherwise, you should post your code here on stackoverflow to get help. It may not be the browser causing the problem, but it could be the way code is written or executed.
I think part of your problem is that you're accessing something from the file system that is meant to be loaded from a web server. For example, I see this error in Chome on your chapter 2 example:
XMLHttpRequest cannot load file://...chapter2/dom.sample.html.
Origin null is not allowed by Access-Control-Allow-Origin.
Things seem to be behaving reasonably well in Chrome other than that sort of thing.
I usually target IE[789], Chrome, Firefox, Safari, and Opera and I haven't seen many browser issues that are specific to jQuery or jQuery-UI. The problems are mostly CSS issues and certain JavaScript problems (in IE for both) that aren't jQuery problems.
Version 3 of jQuery is maintained for the following desktop browsers :
Chrome: (Current - 1) and Current
Edge: (Current - 1) and Current
Firefox: (Current - 1) and Current
Internet Explorer: 9+
Safari: (Current - 1) and Current
Opera: Current
It is also maintained for the following mobile browsers :
Stock browser on Android 4.0+
Safari on iOS 7+
Source : https://jquery.com/browser-support/
I wouldn't be overly worried about the cross-browser compatibility of jQuery so much as I would the quality of the code in the case of this book. I haven't personally looked at this book so I can't make a personal judgement; however, I am the lead developer for a web application that currently has around 15,000 users and we have been confidently using jQuery for a couple of years now with no issues. We have to support customers on a number of platforms using all of the major browsers that are on the market. When jQuery code is written properly and tested for all environments, it can absolutely work properly regardless of what browser you are using.
Code samples appear to use outdated jQuery v1.4. Download latest version and check known issues for more details about cross-browser compatibility.
I don't know why but if I copy whole example directory to the tomcat/webapps, it works fine. But if I open page (lab.selectors.html) directly from the browser, it doesn't display dom sample section. The error message from the firefox console was like this:
[16:56:36.335] junk after document element # file:///C:/JavaScript/jqia2/chapter2/dom.sample.html:2
Related
I am trying to build a simple AngularJS application using an old Chrome (version 2010).
Then I am facing various problems with routing. Basically Chrome becomes unstable, even crashes often.
I suspect that my old Chrome is not compatible with the specific AngularJS I am using (v1.3.8).
Where can I find such information? I mean the version of Chrome needed by AugularJS of specific version?
I searched AngularJS document, but didn't get a clue.
Edited:
Quoted from link https://code.angularjs.org/1.3.8/docs/misc/faq:
We run our extensive test suite against the following browsers: Safari, Chrome, Firefox, Opera 15, IE9 and mobile browsers (Android, Chrome Mobile, iOS Safari). See Internet Explorer Compatibility for more details in supporting legacy IE browsers.
I think these details above are a little vague as a reference. I understand the recommended practice is upgrading Chrome to the latest. As "Derek 朕會功夫" commented, my environment is restricted to some extent. One of the restrictions is, it is not feasible to upgrade Chrome.
That is why I want to find out the exact Chrome version supported by AngularJS. People may come up with similar concerns with other browsers like Firefox. Right?
thanks!
Answer To PSL: I am not using bangrang.
BTW, "add a comment" link doesn't work for me , so I have to comment here :(
As far as I can tell, you require Chrome 13 (MDN) from 2011 in order to support the functions tested in the Angular source found here, such as File and Blob.
I put together a web app that looks great in Chrome, Firefox and Safari, but when it comes to IE 10 and 11, it just falls apart. As a matter of fact, it works worse in IE 11 than 10.
In IE 11, a <canvas> element won't even show up, and some <div> elements look really strange and don't have a border-radius, even though I specified it in the CSS. Unfortunately, there are no errors in the console and frankly I'm not seeing where the problems are coming in to play within the CSS and JS.
What would one do in such a situation where you don't really see any good starting point to debug IE?
I was hoping that running things through W3C Validator and JSHint / lint would help, but even those are entirely clean. It would be nice to find some tool to make this a cleaner process as well aside from these noted, but so far I'm shooting blanks.
For some reason Microsoft decided to enable "Compatibility mode" in IE 8 and on (now renamed to "Emulation" in IE 11). The purpose of this is to be able to see websites in a legacy mode so that one can develop sites and see how it will look on older browsers and even make it work "correctly" on sites that are not using current web standards for their design, etc.
Unfortunately they have made it default to ON for local area network connections. Seems like a skewed choice, but as Terry noted in the comment, it is indeed a problem with a solution:
From this blog post:
The solution [is] to disable IE11’s Compatibility View for intranet
sites by doing Setting (gear icon) > Compatibility View Settings >
uncheck “Display intranet sites in Compatibility View” checkbox.
Making that configuration change immediately [gets] IE11 to start
rendering the page properly.
So I've been looking at Spine.js recently as an alternative to Backbone. However, in the documentation is states:
Works in all major browsers (Chrome, Safari, Firefox, IE >= 7)
then in the comments on this page some one says:
Spine doesn't seem to run in IE6 or IE7... Maybe even other Internet
Explorers. Shouldn't this be pointed out? Backbone runs fine with
these. Am I just missing something?
reply:
Maybe because of json? "If you're using an older browser which doesn't
have native JSON support (i.e. IE 7), you'll need to include json2.js
which adds legacy support." (from the docs)
This is literally ALL the information i could find on the subject. Does anyone know if ie6 is at all supported? If not I'm afraid I will not be able to use it...
I can confirm that spine.js works on IE7 - we don't have IE6 as a requirement nor any IE6 tests machines, so I can't comment on IE6 support.
I would suggest running a quick test, using it takes under an hour to get a simple app running that you can verify things on.
It is very slow to access this page using IE, but much faster using Firefox. Especially when I increase the number of nodes of people. Any ideas what is wrong?
http://thejit.org/static/v20/Jit/Examples/RGraph/example1.html
BTW: IE is even slow when accessing from local file system.
thanks in advance,
George
Internet Explorer's Javascript engine is slower than that from other web browsers, at least when using IE with versions lower than 9. So, if you're using IE 6, 7 or 8, now you know why.
Like raynjamin said, try testing IE using Sunspider.
The latest stable Firefox (3.6) is fast, but for example, Google Chrome is even faster. A browser's Javascript speed depends on its underlying implementation.
Update: to give you an idea of how "fast" IE is compared to other browsers, I've done a benchmark on my own computer using Sunspider 0.9.1. Here are the results:
- Internet Explorer 8: 5039.8ms
- Firefox 3.6: 967.9ms (loaded with extensions)
- Chrome 9: 276.3ms
- Opera 10.6: 293.2ms
- Safari 5: 397.0ms
As you can see, IE 8 is about 5 times slower than Firefox 3.6 and almost 20 times slower than Chrome 9, at least when using Sunspider tests. That is a drastic difference and you can see that IE 8 isn't all that fast.
Update 2: There is one way to make IE faster. A plugin called Chrome frame exists. Using this plugin will make IE faster since it will use Chrome's engine. I haven't tried it personally, but I've heard good things about it.
IE is slow. Fact.
Javascript runs much slower in IE than in other modern browsers. You can test it for yourself using a javascript benchmark like sunspider.
Guys Got the Culprit here... :) :)
After doing lot of RnD on Server side and Client side, I took a look at "Developer Tool" in IE. You can find something like "Document Mode: Quirks". If you check the Wiki page for this Quirks mode, You can find a definition as "In computing, quirks mode refers to a technique used by some web browsers for the sake of maintaining backward compatibility with web pages designed for older browsers, instead of strictly complying with W3C and IETF standards in standards mode."
So this all becuase of checking for compatibility for all components on page. And hence the performance issue. :)
And When I changed this mode to IE 8 Standard. Things started working really well.
IE and its issues ...!!!! :D
Is it necessary to test the rendering of my website in both Chrome and Safari despite the fact that both browsers implement the Webkit rendering engine underneath?
Is this a cop out by developers or a valid assumption to make?
I am specifically asking about whether the pages of my website will render the same in both browsers and whether my Javascript will work in both browsers.
There are some slight differences, so I would test in both. Some examples:
By default Safari has 3rd-party cookies disabled, but Chrome has them enabled by default.
Safari does not store <noscript> content in the DOM, Chrome does
Chrome keeps each browser window sandboxed in its own operating system process (multi-process model). Safari keeps all windows in one process. [Note though: The upcoming WebKit2 will have support for the multi-process model built in].
Chrome uses the V8 javascript engine, Safari uses Nitro.
I know there a few other differences I have encountered, but I can't remember them off the top of my head. I'll update this post if any occur to me.
They use different JavaScript engine, Chrome:V8, Safari:Nitro
Each browser may choose to include different features of webkit in their final versions, so they are not always the same.
Even different versions of Chrome will behave differently, same for different versions of Safari. So I wouldn't use this assumption, and would test in both browsers.
Interesting question, I was thinking about this earlier. I would say yes, just because the rendering engine is only one part of the browser. You also have to take into account that there are many versions of each browser still in use.
It doesn't take too long to test the page in ether, better safe then sorry.