Improve JS performance with $.noop

Alex Peattie

/

03 Nov, 2011

1 minute read

/ comments

Just a simple tip that you might not be aware of - if you have an empty, anonymous function in your code like this:

{ foo: function(){} }

and you’re using jQuery, you can use $.noop (docs) instead:

{
  foo: $.noop
}

It’s a little shorter, but are there any other advantages? There are indeed. Say you have a plugin which creates a widget, with an onClick callback:

$.fn.myWidget.defaults = {
  onClick: function () {}
}

A new anonymous function will be created every time you instantiate a widget. If you’re dealing with hundreds or thousands of instances those extraneous functions add unnecessary overhead, slowing things down. If instead we use $.noop:

$.fn.myWidget.defaults = {
  onClick: $.noop
}

We’re reusing a single empty function over and over, rather than creating a new one each time. For more info, take a look this Stackoverflow question.