Каков наиболее оптимизированный способ выбора всех элементов HTML, существующих в определенной области?

Question

Есть ли оптимизированный способ выделить все элементы DOM внутри прямоугольника?

Чтобы прояснить ситуацию, я привел несколько иллюстраций.Представьте, что у нас есть HTML-страница, подобная этой:

Теперь мы собираемся выбирать элементы на основе определенного прямоугольника.

const ourBox = {
    offsetTop: 1100,
    offsetLeft: 600,
    width: 400,
    height: 400
}

const elements = getAllElementsInsideBox(ourBox)

console.log(elements)
// Logs array of elements which have collisions with imagined box

Для вышеприведенного поля выбранными элементами будут те элементы, которые обозначены синей рамкой, как это видно на рисунке:

Bonus Challenge

Если не так сложно найти оптимизированный код для прямоугольника, давайте сделаем его более сложным, выбрав элементы внутри круга.Код будет выглядеть так:

const ourCircle = {
    centerTop: 1200,
    centerLeft: 500,
    radius: 150
}

const elements = getAllElementsInsideCircle(ourCircle)

console.log(elements)
// Logs array of elements which have collisions with the imagined circle

Это вызов для меня, и я над ним работаю.Если я найду лучшее решение, которым я поделюсь с вами здесь, я также буду признателен, если вы поделитесь со мной своим решением.

Примечание. Проверка смещений всех элементов по одному - это один из способов, номожет быть, не так оптимизирован!попробуем по-разному.