Benchmark: Dragging tests - MeasureThat.net

Script Preparation code:

var svgns = "http://www.w3.org/2000/svg";
var bboxCRect = document.createElementNS(svgns, 'rect');
function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}
function abs(x) {
  return x < 0 ? x * -1 : x;
}
var moveBboxSvg0 = (offsetX, offsetY, xStart, yStart) => {
  if (offsetX < xStart) {
    bboxCRect.setAttribute('x', offsetX)
    bboxCRect.setAttribute('width', xStart - offsetX)
  } else {
    bboxCRect.setAttribute('width', offsetX - xStart)
  }

  if (offsetY < yStart) {
    bboxCRect.setAttribute('y', offsetY)
    bboxCRect.setAttribute('height', yStart - offsetY)
  } else {
    bboxCRect.setAttribute('height', offsetY - yStart)
  }
}

var moveBboxSvg1 = (offsetX, offsetY, xStart, yStart) => {
  if(offsetX < xStart){bboxCRect.setAttribute('x', offsetX)}
  if(offsetY < yStart){bboxCRect.setAttribute('y', offsetY)}

  bboxCRect.setAttribute('width', abs(offsetX - xStart))
  bboxCRect.setAttribute('height', abs(offsetY - yStart))
}

var moveBboxSvg2 = (offsetX, offsetY, xStart, yStart) => {
  bboxCRect.setAttribute('x', (offsetX < xStart) ? offsetX : xStart)
  bboxCRect.setAttribute('y', (offsetY < yStart) ? offsetY : yStart)
  
  bboxCRect.setAttribute('width', Math.abs(offsetX - xStart))
  bboxCRect.setAttribute('height', Math.abs(offsetY - yStart))
}

var moveBboxSvg3 = (offsetX, offsetY, xStart, yStart) => {
  bboxCRect.setAttribute('x', Math.min(offsetX, xStart))
  bboxCRect.setAttribute('y', Math.min(offsetY, yStart))
  
  bboxCRect.setAttribute('width', Math.abs(offsetX - xStart))
  bboxCRect.setAttribute('height', Math.abs(offsetY - yStart))
}

Tests:

moveBboxSvg0
var i = 1000 while (i--) { moveBboxSvg0(getRandomInt(640),getRandomInt(480),getRandomInt(640),getRandomInt(480)) }
moveBboxSvg1
var i = 1000 while (i--) { moveBboxSvg1(getRandomInt(640),getRandomInt(480),getRandomInt(640),getRandomInt(480)) }
moveBboxSvg2
var i = 1000 while (i--) { moveBboxSvg2(getRandomInt(640),getRandomInt(480),getRandomInt(640),getRandomInt(480)) }
moveBboxSvg3
var i = 1000 while (i--) { moveBboxSvg3(getRandomInt(640),getRandomInt(480),getRandomInt(640),getRandomInt(480)) }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
moveBboxSvg0
moveBboxSvg1
moveBboxSvg2
moveBboxSvg3

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Browser/OS: Chrome 108 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
moveBboxSvg0	516.4 Ops/sec
moveBboxSvg1	486.2 Ops/sec
moveBboxSvg2	406.3 Ops/sec
moveBboxSvg3	376.4 Ops/sec

Dragging tests (version: 4)

Comparing performance of: moveBboxSvg0 vs moveBboxSvg1 vs moveBboxSvg2 vs moveBboxSvg3

Created: one year ago by: Registered User

Jump to the latest result

moveBboxSvg0

moveBboxSvg1

moveBboxSvg2

moveBboxSvg3

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A