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: 232
        
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