Mirrors/text-generation-webui
1
0
Fork 0
mirror of https://github.com/oobabooga/text-generation-webui.git synced 2025-01-09 12:09:04 +01:00
Code Issues Packages Projects Releases Wiki Activity

UI: reduce the CPU usage during text streaming

Browse Source
This commit is contained in:
oobabooga 2025-01-01 17:49:57 -08:00
parent 725639118a
commit 9163951f3a
1 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
js/main.js
View File

@ -446,25 +446,33 @@ function toggleBigPicture() {
//------------------------------------------------ //------------------------------------------------
// Handle the chat input box growth // Handle the chat input box growth
//------------------------------------------------ //------------------------------------------------
let currentChatInputHeight = 0;
// Variables to store current dimensions
let currentChatInputHeight = chatInput.clientHeight;
// Cache DOM elements
const chatContainer = document.getElementById("chat").parentNode.parentNode.parentNode;
const chatInput = document.querySelector("#chat-input textarea");
// Update chat layout based on chat and input dimensions // Update chat layout based on chat and input dimensions
function updateCssProperties() { function updateCssProperties() {
const chatContainer = document.getElementById("chat").parentNode.parentNode.parentNode; const chatInputHeight = chatInput.clientHeight;
const chatInputHeight = document.querySelector("#chat-input textarea").clientHeight;
// Check if the chat container is visible // Check if the chat container is visible
if (chatContainer.clientHeight > 0) { if (chatContainer.clientHeight > 0) {
const newChatHeight = `${chatContainer.parentNode.clientHeight - chatInputHeight + 40 - 100 - 20}px`; const chatContainerParentHeight = chatContainer.parentNode.clientHeight;
const newChatHeight = `${chatContainerParentHeight - chatInputHeight - 80}px`;
document.documentElement.style.setProperty("--chat-height", newChatHeight); document.documentElement.style.setProperty("--chat-height", newChatHeight);
document.documentElement.style.setProperty("--input-delta", `${chatInputHeight - 40}px`); document.documentElement.style.setProperty("--input-delta", `${chatInputHeight - 40}px`);
// Adjust scrollTop based on input height change // Adjust scrollTop based on input height change
if (chatInputHeight !== currentChatInputHeight) { if (chatInputHeight !== currentChatInputHeight) {
if (!isScrolled && chatInputHeight < currentChatInputHeight) { const deltaHeight = chatInputHeight - currentChatInputHeight;
if (!isScrolled && deltaHeight < 0) {
chatContainer.scrollTop = chatContainer.scrollHeight; chatContainer.scrollTop = chatContainer.scrollHeight;
} else { } else {
chatContainer.scrollTop += chatInputHeight - currentChatInputHeight; chatContainer.scrollTop += deltaHeight;
} }
currentChatInputHeight = chatInputHeight; currentChatInputHeight = chatInputHeight;