What are best practices for using mouse events?

// Example of best practices for mouse events in JavaScript

// Function to handle mouse click event
function handleClick(event) {
    console.log(`Mouse clicked at coordinates: (${event.clientX}, ${event.clientY})`);
}

// Adding event listener for mouse click
const button = document.getElementById('myButton');
button.addEventListener('click', handleClick);

// Debouncing to prevent excessive event firing
let debounceTimer;
function debounce(func, delay) {
    return function(...args) {
        clearTimeout(debounceTimer);
        debounceTimer = setTimeout(() => func.apply(this, args), delay);
    };
}

// Use debounce for mouse move events to improve performance
const handleMouseMove = debounce((event) => {
    console.log(`Mouse is moving at: (${event.clientX}, ${event.clientY})`);
}, 200);

document.addEventListener('mousemove', handleMouseMove);