I’ve completed three of the challenges related to using API’s (Random Quotes, Weather, and Wikipedia Viewer), and I haven’t used the new XMLHttpRequest(); AJAX methodology. I’ve been using $.getJSON("someurl", function(json){});. Are there some rules or best practices that govern when programmers use one or the other way of getting and rendering JSON data?
1 Like
First let’s define what AJAX is, as there appears to be some confusion of terms.
The $.getJSON(...) is AJAX.
The $.ajax(...) is AJAX. (obviously…)
The XMLBlahBlahBlah thing is AJAX.
fetch(...) is AJAX.
AJAX is not some standard function or methodology. It is a technology design pattern. If you google the term AJAX, you will get a definition like this:
…the method of exchanging data with a server, and updating parts of a web page – without reloading the entire page.
This is why the $.getJSON(...) and the XMLBlahBlahBlah are both AJAX, because they allow you to get data from a API without reloading the page.
Now that we have our terms defined let’s get to the more important question:
Never use the XML blah blah blah format. I cringe when I even see the name. It takes forever to write… Really no one uses XML, but instead JSON and sometimes HTTPS… XML Blah Blah Blah is bad. Don’t use it.
I really like $.getJSON(url, callback). If you are using jQuery, it is obvious what is going on. There is no special need for verbose methodology, nor advanced terms and formatting. Pass in a URL and get formatted results. JavaScript shines because you can write simple scripts - therefore simple functions like $.getJSON(url, callback) are very nice. There is a caveat with this - it requires jQuery. I am not against jQuery, I think it is a great library. However, if you are importing the huge jQuery library simply to make AJAX requests… then you are making your website wrong…
Now let’s talk about fetch. Fetch is new, and therefore isn’t seen a lot on the web. I never knew about it until a couple months ago. Fetch is the new AJAX standard. It is now included in all browser API’s, and MDN considers it a living standard right alongside the (hopefully soon) deprecated XML Blah Blah Blah. Fetch is simple like jQuery’s method. It also doesn’t need a huge library to be loaded every time a user goes to your page as it is a standard. There are a few things you need to know though. As it is a new technology, it is not supported in older browsers including IE (go figure). This is not that big as you can use transpilers and polyfills. There are also parts of it that may change in the future. The other major problem is that Node.js does not natively support it. This is not a huge problem however, as you can easily add fetch support with npm, and on Node, it is probable that you are already using other good ways to do AJAX requests.
For more info:
13 Likes
Thank you for the thorough response!
1 Like
I stopped using jQuery because I felt like it was getting in the way of understanding Javascript as a language. So, for pedagogical reasons, working out how to use XMLHttpRequest first might be advantageous, in the same way that its easier to learn to drive using a manual even though you will spend most of your life driving an automatic.
As for it taking too long to write, yeah, the first couple of times. But every time I re-write it, I do a copy and paste then a retweak and it’s getting to the point where I can rely on the function I’ve written as my own customized $.getJSON.
Thanks for the explanation!
i gained a lil knowledge about ajax request from your explanation :thumbsup: