JQuery-an open source, cross browser JavaScript library-helps simplify event handling and client-side scripting of HTML. Making Ajax development easier, this light-weight tool helps in creating web applications. The main purpose of jQuery is to help you accomplish more while writing less. It ensures easier use of JavaScript on your site. What a number of lines of JavaScript can achieve can be achieved by jQuery in a single line of code. Simplifying a number of complicated tasks involved in JavaScript, like AJAX calls and DOM manipulation, jQuery library comes packed with powerful features.

Using the library effectively is the key to making the most of jQuery. Here are some of the obscure jQuery tips and tricks that can help you make your way through an innovative jQuery project.

1.    Utilize Custom Easing functions: jQuery easing plugin can be used powerfully to put magic effects to your animations. The only hitch with this is that your site visitors have to download another JavaScript file to view these effects. To avoid this, you can just copy the effect you want from the plugin file and insert it into the jQuery.easing object.

2.    Check the weight of your web page: Having a hold on your page weight is highly essential to bring down its loading time. The time your browser takes in loading a web page is directly proportional to the content on it. Running the following code in your console, will quickly help you get a count on the number of DOM elements.

Once you have checked the number, you can optimize the page by eliminating inessential markup and wrapping elements.

3.    Making use of jQuery Data Method: This very useful but rarely known data() method, helps in binding data to DOM elements without making any changes in the DOM.

4.    Lazy loading: This fantastic feature of jQuery helps you load only those elements of content which are highly essential or required. In order to accomplish this, you need to incorporate the jquery.lazyload.js script file.

5.    Ensuring line breaks chainability: Keep the code neat and organized is the key to utilizing it to the maximum.  Ensure proper line breaks and chainability in your jQuery code.

• Instead of going for

• You may go for

6.    Ensuring correct Iteration of Custom Queues: On creating custom queues, the chained methods don’t get automatically called for. It must be done manually and is usually done with the help of dequeue() method. Once called, it will eliminate the next function in the queue and execute it. It is a simple method with very less arguments and used in a meticulous way. This method might consider a single optional argument.

7.    Check the hidden elements using jQuery: Developers often use .hide(), .show() methods to modify the visibility of an element. You can make use of the following code to check if an element if visible or not.

8.    Create an Empty jQuery Object to avoid overhead of a new jQuery object: A new jQuery object involves significant expense. You can sometimes, create an empty object, and fill it with add() method later.

9.    Make use of the latest version of jQuery: To enhance the performance of your website, you must use the latest version of jQuery. With each release, the library gets more powerful as it brings along optimizations and bug fixes. These improvements help you save time and get improved site performance.

10.    Preloading Images: To improve performance on a web page it is useful to utilize preloading images. This can be specifically useful while the animation is in progress. Your web page doesn’t need to wait till the image gets loaded. For preloading images using a simple code, you can use the following code.

Utilizing the jQuery library to the optimum is an art. In fact, there is no end to the number of tools that will be added in future. With time, the tools will get evolved and so the tips and tricks. Remaining updated with the changes and implementing them is the key to getting the best out of it.