[WIP] Opinionated jQuery Style Guide for teams.

jquery-style-guide.md

jQuery Style Guide

This guide applies to jQuery 1-3, or Zepto, or Shoestring, or ...

• prefer native / avoid jQuery (if it's just as easy Vanilla JS, do that)
• prefer lastest jQuery (jQuery 3, smaller, closer to standars)
• avoid $.ready (inject script just before </body>)
• avoid $(window).load()
• use (function($){ }(jQuery)) (avoid conflict, show what $ is)
• prefix jQuery object vars with $
• cache jQuery lookups (var $el = $(el))
• use .on('eventName') (avoid .click() etc)
• use event delegation (faster, more flexible (async items etc))
• avoid .css() (use / toggle CSS classes)
• avoid .show() and .hide() (toggle CSS classes / toggle [hidden])
• avoid .animate() (.fadeIn() etc) (use CSS animations)
• prefer promises over callbacks ($.ajax().then() etc)
• prefer regular element arrays $(selector).get().map(...)
• create a custom build (smaller, exclude .css() etc)
• configure linters for jQuery methods (better IDE support)

Avoid .show(), .hide() and .toggle()