Improve scroll performance by disabling hover effects during scroll

This commit is contained in:
oobabooga 2025-06-09 11:25:36 -07:00
parent 1602ac1c8f
commit 14efd42084
2 changed files with 15 additions and 1 deletions

View file

@ -1624,3 +1624,8 @@ button:focus {
justify-content: center;
display: none;
}
/* Disable hover effects while scrolling */
.chat-parent.scrolling * {
pointer-events: none !important;
}

View file

@ -146,8 +146,12 @@ const targetElement = document.getElementById("chat").parentNode.parentNode.pare
targetElement.classList.add("pretty_scrollbar");
targetElement.classList.add("chat-parent");
let isScrolled = false;
let scrollTimeout;
targetElement.addEventListener("scroll", function() {
// Add scrolling class to disable hover effects
targetElement.classList.add("scrolling");
let diff = targetElement.scrollHeight - targetElement.clientHeight;
if(Math.abs(targetElement.scrollTop - diff) <= 10 || diff == 0) {
isScrolled = false;
@ -155,7 +159,12 @@ targetElement.addEventListener("scroll", function() {
isScrolled = true;
}
doSyntaxHighlighting();
// Clear previous timeout and set new one
clearTimeout(scrollTimeout);
scrollTimeout = setTimeout(() => {
targetElement.classList.remove("scrolling");
doSyntaxHighlighting(); // Only run after scrolling stops
}, 150);
});