What is the most efficient way to handle points / small vectors in JavaScript?

Posted by Chris on Stack Overflow See other posts from Stack Overflow or by Chris
Published on 2011-01-15T13:27:01Z Indexed on 2011/01/15 13:53 UTC
Read the original article Hit count: 147

Currently I'm creating an web based (= JavaScript) application thata is using a lot of "points" (= small, fixed size vectors). There are basically two obvious ways of representing them:

var pointA = [ xValue, yValue ];

and

var pointB = { x: xValue, y: yValue };

So translating my point a bit would look like:

var pointAtrans = [ pointA[0] + 3, pointA[1] + 4 ];
var pointBtrans = { x: pointB.x + 3, pointB.y + 4 };

Both are easy to handle from a programmer point of view (the object variant is a bit more readable, especially as I'm mostly dealing with 2D data, seldom with 3D and hardly with 4D - but never more. It'll allways fit into x,y,z and w)

But my question is now:
What is the most efficient way from the language perspective - theoretically and in real implementations?
What are the memory requirements?
What are the setup costs of an array vs. an object?
...

My target browsers are FireFox and the Webkit based ones (Chromium, Safari), but it wouldn't hurt to have a great (= fast) experience under IE and Opera as well...

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about arrays