And vs Or inBounds

Benchmark created on April 3, 2023

Setup

function inBounds(rect, canvas) {
  if (
    rect.left < canvas.left + canvas.width &&
    rect.left + rect.width > canvas.left &&
    rect.top < canvas.top + canvas.height &&
    rect.top + rect.height > canvas.top
  ) {
    return true;
  }
  return false;
}

function inBounds2(rect, canvas) {
  if (
    rect.left > canvas.left + canvas.width ||
    rect.top > canvas.top + canvas.height ||
    rect.left + rect.width < canvas.left ||
    rect.top + rect.height < canvas.top
  ) {
    return false;
  }
  return true;
}


const canvas = { left: 0, top: 0, width: 100, height: 100 };

Test runner

inBounds({ top: 50, left: -50, width: 100, height: 20 }, canvas);

inBounds2({ top: 50, left: -50, width: 100, height: 20 }, canvas);

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

• Revision 1: published on April 3, 2023