Tips to have Great jQuery Plugins

in JQuery,Software, - October 18, 2014

jQuery is a massively popular JavaScript library. It’s tiny size, fast performance and variety of features make it the number one choice for developers all over the world. From Ajax to animation and everything in between, jQuery can handle it with an API that is extremely easy to use. When making jQuery plugins, there are some things that you should keep in mind. These tips help you save time, effort and hours of frustration.


Use these to make a better end product that is flawless and works without any jitters. When developing your jQuery plugins, make sure you know all the ins and outs it has, as some of the more obscure ones get forgotten easily. Thus, when making your jQuery plugins, keep the following in mind:

1. Make sure your code is documented. The name and version of the plugin should be included, as well as the function, example uses, parameters and contact or support information.

2. Make sure you add a self-invoking anonymous function to close your code. It protects all the variables from tampering by other codes and allowing you to send jQuery into function as a parameter.

3. Keep out static variables from all functions. Doing otherwise wastes memory and increases execution time.

4. Using the Getter/Setter pattern has become standard now. It might make the code’s functions more complicated, but the number of them decreases.

5. Default options should be added and extended. Adding options makes the plugin you’re working on flexible, which is always a bonus.

6. Make sure you return jQuery. It has become standard industry practice.

7. Keep all the selectors simple. Do not try and complicate matters unnecessarily.

8. Use CSS hooks API to get and set specific CSS values. You could hide browser specific implementations and expose a united UI for access to certain properties.

9. Use custom easing functions to add animation effects. This can help with the UI and adds appeal to your plugin.

10. Set global AJAX defaults. Otherwise you might end up with a slow and laggy plugin.

11. Make sure you use HTML5 data attributes that help in the exchange of data between the server and the front end.

12. Use local storage to store client data. This gives control of data over to the client, always good in today’s world.

13. Use the latest version of jQuery to keep up with the times. Bleeding edge replaced cutting edge a long time ago.

14. Make sure your plugin is easy to use. For example, it can be self-initializing.

15. Make sure to use suitable nomenclature for the plugin and it’s versions.

16. Use an excellent template if you want your plugin to succeed. It is easier to build on a solid foundation.

17. Test your plugin over and over again in different environments and different browsers. Anticipate all problems users might face and have a contingency for all of them.

18. Advertise your plugin in places like GitHub or Google Code. Publicize it and demonstrate it anywhere you can!

  • ( or )
    Log in With