Is JavaScript function call faster through prototype or direct reference?

Question

In JavaScript, let's say I want to call aObj.myMethod() from inside bObj. In the case of my application, from the design point of view, aObj is the base class for bObj. JavaScript is a late binding language, which means that myMethod should be resolved at run time. Is the function resolution faster

////////// IF

1-I go naturally with my design and say bObj.prototype=aObj and then at run time I call bObj.myMethod:

function bObj(){...};

bObj.prototype=aObj;


//later
var myBObj=new bObj();
myBObj.myMethod();

////////////////////////OR

2- function resolution can be slow through the prototypes so I keep aObj as a property in bObj, and from inside bObj I call aObj.myMethod()

function bObj()
{
  this.myAObj=new aObj();
  ...
}     

//later:
var myBObj=new bObj();
myBObj.myAObj.myMethod();

My main concern is the execution speed. In my application myMethod is being called millions of times per second. I know that most of the browsers cache the pointers to recently called functions so in both cases the function resolution process gets speeded up. Yet can anyone provide more details on the function resolution mechanism in these two cases and give some insight that which method can be possibly faster? Is the resolution mechanism the same in all the browsers or it is completely browser-dependent?

You can set up your two scenarios at jsperf.com and test it out yourself — David Tang
– David Tang, Commented Apr 5, 2011 at 0:23
Logically, the shorter the property resolution chain the faster the access, however that is not necessarily true in reality. In the code you posted, there are two lookups to find myMethod() in both cases so you've not gained anything. Also, how you call myMethod affects the value of its this keyword, in the first case it will be myBObj, in the second myAObj. So think your design through thoroughly - code that works is better than (marginally) faster code that breaks. — RobG
– RobG, Commented Apr 5, 2011 at 0:47
@user680999: my comments were about performance. Here's a test case to prove my point: jsperf.com/lookupperf. The short chain is slower in all browsers (including Safari on iOS) except IE 6, where the short chain is 3 times faster - but newer versions of IE will likely change that. Given that the long chain is 7 lookups compared to the short chain's 1, I think that's proof enough. Do you have an inheritance chain longer than 7? The bottom line is, don't bother optimising lookup chains purely for performance. — RobG
– RobG, Commented Apr 5, 2011 at 6:52

Sergio Tulentsev · Accepted Answer · 2012-01-06 22:58:33Z

In so far as the way you're referencing you're right, "function resolution can be slow". So let's have a look..

Following the proto chaing lookup, if you made myMethod a prototype method, eg: aObj.prototype.myMethod=somemethod, then the first way, myBObj.myMethod(), will get a 'resolution hit' on the second try when it hits the inherited prototype method since the myBObj instance myMethod was not set.

The second way, myBObj.myAObj.myMethod(), will get a 'resolution hit' on the second try when it hits the prototype method since, again, the instance method was not set (myAObj=new aObj() does not set myAObj.myMethod yet will set myAObj.prototype.myMethod, So the way you're doing this, there is no difference.

To get a performance gain from either of the ways you're doing this either make sure the instance method you are going to call is set and then reference it:

bObj.myMethod=bObj.prototype.myMethod;
bObj.myMethod();

or

myAObj.myMethod=myAObj.prototype.myMethod;
bObj.myMethod();

in both cases the first lookup gets the instance method and it's used which is better.

To get the best performance gain, eliminate the lookup altogether and reference the prototype method:

myBobj.prototype.myMethod();

or

myBObj.myAObj.prototype.myMethod();

no 'function resolution', is necessary in these last two cases.

Though we all know that a Function function is interpreted every time it's used and declared functions are compiled(interpreted) once and are thus faster it remains somewhat of a mystery if setting a declared function to an object's prototype actually makes it execute faster.

If you could find this out then you would know exactly how to get a function, any function, to execute at it's fastest: declare it or set it as a prototype function, whichever is best if any, and if the prototype method is faster, avoid any proto chain lookups by referencing the prototype method directly.

Tareq Sha · Accepted Answer · 2012-01-18 03:22:26Z

I've just finished several performance tests for this specific case. It was run with Mozilla Rhino 1.7R3, in optimized mode.

Your question is actually about property look-ups. Once a property (in your case, with a function value) is found in the chain of available scopes, further operations perform identically in both cases.

The obvious result is that look-up of a function defined on the prototype is slower. On average calling a prototype function took 35% more time. I got same same result with directly calling local functions vs directly calling functions in the global scope.

Own properties resolve faster because their scope comes before the prototype's.

Make your decision. Remember that prototype are great for code maintenance and object reuse.

Collectives™ on Stack Overflow

Is JavaScript function call faster through prototype or direct reference?

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related