Is there a jQuery stand-alone Ajax module?
JavascriptJqueryJavascript Problem Overview
Is there a way to get jQuery's Ajax module? The point is I do not need the whole library, but only its Ajax module (I need to include this module in several iframes).
Javascript Solutions
Solution 1 - Javascript
Update 2016
You can use this tool to build your own custom jQuery version.
As of jQuery 2.1.1
Full file sized unminified is: 241.55 Kb
Ajax Only minified is: 49.60 Kb
That is a 5x reduction in size.
Solution 2 - Javascript
As Darin already says, it's all or nothing. JQuery's Ajax functions are closely intertwined with the rest of the functionality.
There are a few other, stand-alone Ajax libraries around like Matt Kruse's Ajax toolbox - maybe that helps.
I would consider loading the full jQuery library. If you link to jQuery on a CDN, loading times will be minuscule.
Solution 3 - Javascript
Another option would be to use the built-in fetch
API provided by the browser.
Here is an example snippet:
fetch('http://localhost:3000/users.json', {
method: 'POST',
mode: 'cors',
redirect: 'follow',
body: JSON.stringify({
user: {
firstName: 'john',
lastName: 'doe'
}
}),
headers: new Headers({ 'Content-Type': 'application/json' })
}).then(function() {
/* handle response */
});
This blog post is a great introduction to the API and shows more use cases.
fetch
doesn't have full cross-browser support yet (I think mainly IE and Safari are lacking), but there is polyfill that you can use until that day comes.
fetch
polyfill: https://github.com/github/fetch
Older browsers will also need a Promise
polyfill (one option, another option).
Solution 4 - Javascript
As of jQuery 1.8 you can do it: LINK
Solution 5 - Javascript
You can view standard javascript alternatives to jQuery at youmightnotneedjquery.com
For example the alternative to $.ajax
post
is:
var request = new XMLHttpRequest();
request.open('POST', '/my/url', true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.send(data);
And the alternative to $.ajax
get
is:
var request = new XMLHttpRequest();
request.open('GET', '/my/url', true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
// Success!
var resp = request.responseText;
} else {
// We reached our target server, but it returned an error
}
};
request.onerror = function() {
// There was a connection error of some sort
};
request.send();
Solution 6 - Javascript
I've created a custom build of jQuery 1.7.1 here:
Solution 7 - Javascript
AMD user please read this, my answer is for building a single file.
Or just use this library: ded / reqwest (4 KB, min & gzip)
-
Download source code and run
npn i
-
Open
/src/jquery.js
and remove any moudle you don't want, but keep"./exports/amd"
,"./exports/global"
define([ "./ajax", "./ajax/xhr", "./ajax/script", "./ajax/jsonp", "./exports/amd", "./exports/global" ], function (jQuery) { "use strict"; return jQuery; });
-
Run
grunt custom:-sizzle
-
Goto
/dist
and take your build
Modules in your build now:
- core
- deferred
- ajax
Size:
- just build: 85 KB
- build with min: 26 KB
- build with min & gzip: 10 KB
Solution 8 - Javascript
If you really really want just the Ajax parts of jQuery you can get the code from their repository (https://github.com/jquery/jquery), glancing at it you would want to look at "ajax.js" and "core.js" in the "src" directory. You would then want to compile them together with the closure compiler or something.
But as others stated, it would be a lot easier to just load it from one of the CDNs (jQuery, Google, Microsoft) which most users will have cached anyway.
Solution 9 - Javascript
YES, I just did mine, http://noypi-linux.blogspot.com/2013/05/build-jquery-with-ajax-only.html
you only need these files (resulting minified is about 30Kb):
/d/dev/javascript/jquery/jquery/src/intro.js
/d/dev/javascript/jquery/jquery/src/core.js
/d/dev/javascript/jquery/jquery/src/callbacks.js
/d/dev/javascript/jquery/jquery/src/deferred.js
/d/dev/javascript/jquery/jquery/src/support.js
/d/dev/javascript/jquery/jquery/src/data.js
/d/dev/javascript/jquery/jquery/src/event.js
/d/dev/javascript/jquery/jquery/src/serialize.js
/d/dev/javascript/jquery/jquery/src/ajax.js
/d/dev/javascript/jquery/jquery/src/ajax/xhr.js
/d/dev/javascript/jquery/jquery/src/exports.js
/d/dev/javascript/jquery/jquery/src/outro.js
Solution 10 - Javascript
Update: This library was removed from GitHub, I would recommend using Fetch API instead. All modern browsers support it without IE.
Old answer: You can try AJAJ. It's a very tiny(less than 1kb gzipped) library to make ajax calls. And its syntax is very similar to jQuery.
For example:
ajaj({
method: "POST",
url: "/path/to/request",
data: {
name: "AJAJ",
version: "1.0.0",
},
success: function (data) {
console.log(data);
},
fail: function (error) {
console.log(error);
},
});
Solution 11 - Javascript
It's all or nothing. Of course jquery is open source and you could extract the part you are interested in in your own library (good luck with this). You may consider using a CDN which will ensure that most users will already have it cached in their browsers so you shouldn't be concerned about size.
Solution 12 - Javascript
There is none out of the box but you can of course cut and paste from the existing file and then minimize it.
If you are just worried about the size of the library serving it from a CDN from Google, MS or jQuery will probably require less data traffic as most browsers already have the files cached.