Najnowocześniejsza metoda uzyskiwania pozycji myszy w obszarze roboczym w natywnym JavaScript

Po pierwsze, wiem, że to pytanie zostało zadane wiele razy. Jednak podane odpowiedzi nie są spójne i do uzyskania pozycji myszy używane są różne metody. Kilka przykładów:

Metoda 1:

canvas.onmousemove = function (event) { // this  object refers to canvas object  
Mouse = {
    x: event.pageX - this.offsetLeft,
    y: event.pageY - this.offsetTop
}
}

Metoda 2:

function getMousePos(canvas, evt) {
var rect = canvas.getBoundingClientRect();
return {
  x: evt.clientX - rect.left,
  y: evt.clientY - rect.top
};
}

Metoda 3:

var findPos = function(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) { 
    do {
       curleft += obj.offsetLeft;
       curtop += obj.offsetTop; 
    } while (obj = obj.offsetParent);
}
return { x : curleft, y : curtop };
};

Metoda 4:

var x;
var y;
if (e.pageX || e.pageY)
{
    x = e.pageX;
    y = e.pageY;
}
else {
    x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
    y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; 
} 
x -= gCanvasElement.offsetLeft;
y -= gCanvasElement.offsetTop;

i tak dalej.

Ciekawe, która metoda jest najnowocześniejsza pod względem obsługi przeglądarki i wygody w umieszczaniu pozycji myszy na płótnie. Czy jest to coś, co ma marginalny wpływ, a którykolwiek z powyższych jest dobrym wyborem? (Tak, zdaję sobie sprawę, że powyższe kody nie są dokładnie takie same)

questionAnswers(3)

yourAnswerToTheQuestion