I recently discovered that the biggest Russian search engine Yandex (yeah, it’s bigger than Google in Russia) is using jQuery on its home page. It also hosts all previous jQuery versions on it’s fast gzip enabled servers just like Google and MIcrosoft do.

Because most of the Russian internet users have visited Yandex already, they already have it in their browser cache. I also did route tracing from Russian server to Google CDN servers and I was directed to the server in California, USA and pining the local Russian CDN server was at least 3 times faster.

Anyway, if you decide to use Russian CDN to host your jQuery files here are the links:

Minified versions
http://yandex.st/jquery/1.2.6/jquery.min.js
http://yandex.st/jquery/1.3.0/jquery.min.js
http://yandex.st/jquery/1.3.1/jquery.min.js
http://yandex.st/jquery/1.3.2/jquery.min.js
http://yandex.st/jquery/1.4.0/jquery.min.js
http://yandex.st/jquery/1.4.1/jquery.min.js
http://yandex.st/jquery/1.4.2/jquery.min.js

Non minified versions
http://yandex.st/jquery/1.2.6/jquery.js
http://yandex.st/jquery/1.3.0/jquery.js
http://yandex.st/jquery/1.3.1/jquery.js
http://yandex.st/jquery/1.3.2/jquery.js
http://yandex.st/jquery/1.4.0/jquery.js
http://yandex.st/jquery/1.4.1/jquery.js
http://yandex.st/jquery/1.4.2/jquery.js

jQuery UI links

http://yandex.st/jquery-ui/1.8.2/jquery-ui.min.js

Hosted versions
1.8.2, 1.8.1, 1.8.0, 1.7.3, 1.7.2, 1.7.1, 1.7.0, 1.6.0

jQuery UI modules can be downloaded seperately
http://yandex.st/jquery-ui/1.7.2/effects.blind.js
http://yandex.st/jquery-ui/1.8.0/jquery.effects.blind.min.js

Language files
http://yandex.st/jquery-ui/1.7.2/i18n/ui.datepicker-ru.js
http://yandex.st/jquery-ui/1.8.0/i18n/jquery.ui.datepicker-ru.min.js

jQuery UI CSS files (matches original directory names)
http://yandex.st/jquery-ui/1.8.0/themes/humanity/jquery.ui.all.min.css

jQuery Mobile is an attempt to create a javascript framework that would work on all major mobile browsers. In this post I will try to lay down all the facts that I could find about jQuery Mobile, so that you are up to date.

jQuery team has mentioned that they were planning and started to work on jQuery for Mobile devices when they announced jQuery 1.4. John Resig said that they already had different mobile devices from sponsor for testing purposes. Anyway, jQuery Mobile is officially announced now, but there is a very little information about it.

Here are some facts that I found:

1. jQuery Mobile will be in core, NOT as a separate distribution like jquery.mobile.js
2. jQuery UI team will improve current jQuery UI and develop new mobile components (initial designs).
3. Release of the jQuery Mobile and new jQuery UI components is planned for October 2010.
4. As of writing of this post, jQuery Mobile source code is not available. The code will be pushed to the jQuery core’s GitHub repository and announced on the official jQuery mobile page.
5. You can help jQuery Mobile project by testing jQuery core on your mobile devices at TestSwarm.

That’s all I could find on jQuery Mobile for now. Subscribe to my RSS or follow me on Twitter to stay updated about news related to jQuery Mobile.

A lot of users requested a demo for my jQuery Twitter plugin. It has been a while since I updated the plugin, so I downloaded the latest version and while looking thought the code found couple of bugs. So, here comes updated and fixed jQuery Tweeter plugin - jTwitter 1.1.1.

In this release, I fixed a little bug that would not allow you request Tweets without number of posts like this:

// Defaults to 5 latest posts
$.jTwitter('jQueryHowto', function(posts){
  //Callback function with the user data
});

You can specify the number of posts you want to be fetched like so:

// Get latest 13 posts
$.jTwitter('jQueryHowto', 13, function(posts){
  //Callback function with the user data
});

Also, I created a simple demo page for the plugin here. Please visit and see the code and also note that with this plugin you can create a custom Twitter badge with no design limitations!

Update: Pushed the project to GitHub.

After Microsoft decided to ship and use jQuery library for its JavaScript needs in Visual Studio, hosting jQuery on Microsoft CDN servers is actually a logical and good decision. Yes, some of us might argue that Google already hosts jQuery, but Microsoft can not recommend to use its competitor’s services, can it?! :)

Anyway, intention of this post is not to discuss why Microsoft introduced its own jQuery hosted servers, bu to share links to Microsoft hosted jQuery library. Here we go:

jQuery 1.4.x
http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.js
http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js
http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.1-vsdoc.js

jQuery 1.3.2
http://ajax.Microsoft.com/ajax/jQuery/jquery-1.3.2.js
http://ajax.Microsoft.com/ajax/jQuery/jquery-1.3.2.min.js
http://ajax.Microsoft.com/ajax/jQuery/jquery-1.3.2-vsdoc.js
http://ajax.Microsoft.com/ajax/jQuery/jquery-1.3.2.min-vsdoc.js

Microsoft also host jQuery Validation and jQuery UI files.

Currently Microsoft AJAX CDN hosts only jQuery version 1.3.2, but they will add more releases in the future. To see a full list of the JavaScript libraries and their URLs that are already hosted on CDN cache go here: www.asp.net/ajax/cdn

Jetpack is a new product of Mozilla Labs. It is basically a new way to create Firefox plugins using web programming languages like HTML, CSS and JavaScript. The idea behind is the same as for Adobe AIR. If you know HTML, CSS and JavaScript you can build a Firefox plugin in no time.

The bad news is that Jetpack is still in early developer testing stage, so it is not available in Firefox yet. The good news is that Jetpack is using jQuery and you can use it to do all kinds of stuff like responding to user click events, manipulate any website DOM elements and use cross-site XMLHttpRequest object, etc. Besides, Jetpack can be setted up to use other javascript libraries such as prototype.js, dojo.js etc. and third party API libraries such as Twitter, Google, etc. API libraries.

Where to go from here?

If you want to learn more about Jetpack and how to use jQuery with it refer to this links:

1. Watch this Jetpack video
   Good starting point to get an idea of what Jetpack is and how jQuery is used within it. Also good starting point to understand what kind of things can be don with Jetpack.
2. Read Jetpack tutorial
   Official Jetpack introduction tutorial from Jetpack team. Probably the first article you must read about developing for Jetpack.
3. Jetpack API documentation
   A list of global variables that are available in your Jetpacks. Currently it has a very limited global variables and functions.
4. Jetpack plugin for your Firefox
   If you want to develop Jetpacks you need to install this Firefox plugin.
5. Available Jetpack to investigate the code here and here.
   Most developers prefer understanding the logic and learning by investigating someone else’s code easier.

I am planning to post more Jetpack tutorials on this blog and try to show what kind of things can be done using Jetpack and jQuery. Keep tuned by following me on Twitter (@jQueryHowto) or subscribe to blog’s RSS.

It is Friday and we don’t want to read long posts and tutorials. So today’s post is going to be short and sweet. I’ve been playing a lot with Twitter lately. I wrote some jQuery and javascript functions that get user details, etc. I will share it with you next week.

But for today, I would like to share Twitter’s JSON and JSONP API URL. I am sharing it because it was hard to find it first. I actually wrote a jQuery plugin that gets Twitter user details using my previous post on cross site AJAX querying method. All Twitter API usage tutorials and articles I found on internet were based on RESTful non JSONP API, so I though I'll share Twitter JSON(P) API with you. Anyway...

Twitter JSON(P) API URL:

http://twitter.com/status/user_timeline/USERNAME.json?count=10
&callback=JSONPcallbackFunction

Here is a code to use with jQuery’s $.getJSON() function:

http://twitter.com/status/user_timeline/USERNAME.json?count=10
&callback=?

We have put ? (question mark) for callback function name so jQuery could replace it with a dynamic one that it has created.

Update: Check out jQuery Twitter API plugin – jTwitter, that uses this Twitter API.

Since writing on this blog I posted two jQuery plugins and I needed to compress my js files. So as jQuery documentation suggests I used YUICompressor. YUICompressor is javascript and CSS file/code compressor written in Java language. So to run one yourself you will need JRE installed on your machine.

Then call this command:

java -jar /path/to/yuicompressor.jar path/to/file.js -o path/to/minimized.file.js

Your file will be compressed and saved to path you specified as the last parameter (in our case minimized.file.js).

Links:

1. Download YUICompressor
2. Download JRE (required to run java applications)
3. Online version of YUICompressor

In pursue for my JavaScript code performance and some questions on jQuery mailing list I looked for and eventually came across some of the JavaScript code packers. Here is a list of custom JavaScript code compressors available for free.

1. YUI Compressor (from Yahoo)
2. JSMin (by Douglas Crockford)
3. ShrinkSafe  (from Dojo library)
4. Packer (by Dean Edwards)

According to general opinion of developers on the net (and jQuery official site) you should use Yahoo's YUI Compressor to compress your jQuery and JavaScript code.

There are times when you can't understand why your code is not doing what it's supposed to do. After killing half an hour on trying to figure out what is the problem you either give up and decide to rewrite or leave it for later. Later looking at your code you clearly see the bug and think how you couldn't you see it.

For cases like that you can use online JavaScript code validator JSLint.

Formerly Google AJAX API, now Google hosted libraries is a content delivery network (CDN) for several popular JavaScript libraries. The CDN provides reliable, high-speed, high-availability and global access to files hosted on it.

UPDATE:
You can also use jQuery hosted by Microsoft CDN servers.

If you are using one of the libraries belowe, Google has you covered:

• AngularJS
• Chrome Frame
• Dojo
• Ext Core
• jQuery & jQuery UI
• MooTools
• Prototype
• script_aculo_us
• SWFObject
• Web Font Loader

As you can see, Google CDN also hosts jQuery (as well as jQuery UI). In this post we will concentrate on jQuery.

Google CDN hosts uncompressed as well as minimized jQuery files, supports gzip. The main advantage of using Google hosted jQuery is that if your visitors have already visited some site that loaded jQuery from Google servers, then it would already be on user's machine. So the browser would load it from its' cache.

Today, almost everyone is using Google hosted jQuery. So there is a huge chance that your visitors have it cached. By using Google CDN, you are reducing your page load times.

Here is how to load jQuery from Google servers:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>

At the time of writing, Google hosts the following versions of jQuery:

2.0.3, 2.0.2, 2.0.1, 2.0.0,
1.10.2, 1.10.1, 1.10.0,
1.9.1, 1.9.0,
1.8.3, 1.8.2, 1.8.1, 1.8.0,
1.7.2, 1.7.1, 1.7.0,
1.6.4, 1.6.3, 1.6.2, 1.6.1, 1.6.0,
1.5.2, 1.5.1, 1.5.0,
1.4.4, 1.4.3, 1.4.2, 1.4.1, 1.4.0,
1.3.2, 1.3.1, 1.3.0,
1.2.6, 1.2.3

You can see up to date versions of hosted jQuery versions on Google Developers page.

Legacy method: Loading jQuery using Google AJAX API

Up until jQuery version 1.7.2, Google had javascript library loader API. If your legacy project is already using it to load other libraries, here is how you can use it to load jQuery.

<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("jquery", "1.7.2");
  google.setOnLoadCallback(function() {
    // Your code goes here.
  });
</script>

Loading jQuery UI from Google CDN servers

Google CDN also hosts jQuery UI files. So if you are using jQuery UI you can also load it using these links and code:

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js" type="text/javascript"></script>

<!-- OR Legacy method -->

<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("jquery", "1.3.2");
  google.load("jqueryui", "1.7.2");
  google.setOnLoadCallback(function() {
    // Your code goes here.
  });
</script>

Currently Google hosts these versions of jQuery UI library:

1.10.3, 1.10.2, 1.10.1, 1.10.0,1.9.2, 1.9.1, 1.9.0,
1.8.24, 1.8.23, 1.8.22, 1.8.21, 1.8.20, 1.8.19, 1.8.18, 1.8.17, 1.8.16,
1.8.15, 1.8.14, 1.8.13, 1.8.12, 1.8.11, 1.8.10, 1.8.9, 1.8.8, 1.8.7, 1.8.6,
1.8.5, 1.8.4, 1.8.2, 1.8.1, 1.8.0, 1.7.3, 1.7.2, 1.7.1, 1.7.0, 1.6.0, 1.5.3, 1.5.2