Как максимально быстро кликнуть по элементу в браузере?

Question

Есть потребность реализовать расширение-кликер для хрома. У меня есть АМО CRM в ней нам падают лиды, далее, кто первый успел взять лид нажатием кнопки "принять" на всплывающем окне, тот и будет с ним работать. У моей коллеги, написан, какой-то софт/расширение, которое кликает на эту кнопку ещё до появления её в визуальной части сайта. Написал такой скрипт:

function observeAndClickElement() {
    const targetSelector = '.f5-notifier-notification-action_btn';

    // Функция для нажатия на элемент
    function clickElement(element) {
        if (element) {
            // Вызов функции клика
            element.click();
            console.log("Кнопка в уведомлении была нажата");
        }
    }

    // Функция для рекурсивной проверки наличия элемента
    function checkForElement() {
        const notificationButton = document.querySelector(targetSelector);
        clickElement(notificationButton);

        // Запуск следующей проверки
        requestAnimationFrame(checkForElement);
    }

    // Запуск первой проверки
    checkForElement();
}

// Запуск отслеживания и нажатия на элемент
observeAndClickElement();

С таким скриптом, коллега всё равно берёт все заявки, а значит каким-то образом раньше меня получает информацию, о полявлении кнопки. Дсотупа к какой-либо серверной части нет ни у меня, ни у неё. Как можно оптимизировать/переписать код чтобы стать первым или хотябы забирать часть её заявок, если вдруг потолком будет скорость интернета и другие факторы на которые я не смогу повлиять?

Answer 1

Во-первых обход

Функция document.querySelector, конечно, довольно быстрая функция, но мы сможем делать быстрее если будем искать не с document, а с более близкого элемента. К примеру - с панели уведомлений. Один раз в начале находите панель уведомлений или что-то ещё ближе к кнопке, сохраните его в каком-нибудь константе и потом оттуда используйте querySelector.

const panelNotifications = document.querySelector(selectors);

function click() {
  panelNotifications.querySelector(buttonSelectors)?.click();
}

Так мы выиграем несколько миллисекунд

Во-вторых слушание

Если мы сможем создать событие, которое послушает сервер или другое событие, на которое приходит уведомление то будем быстрее. Метод с requestAnimationFrame работает каждые 0.006-0.007 секунд, а прямой обработчик будет работать моментально.
Ну можно попробовать слушать WebSocket если сайт работает через него:

const socket = new WebSocket(link);
socket.addEventListener(`message`, (event) => {
  click();
});

Пока что эти методы, но задача довольно интересная, я ещё подумаю.

БЛОГ НА HUSL

Как максимально быстро кликнуть по элементу в браузере?

Ответы (1 шт):

Во-первых обход

Во-вторых слушание