From 1930a57edddbc6dde0f5188653b16053c420d94c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E1=B4=80=E1=B4=8D=E1=B4=9B=E1=B4=8F=E1=B4=80=E1=B4=87?=
 =?UTF-8?q?=CA=80?= <amtoaer@gmail.com>
Date: Sat, 21 Feb 2026 23:37:30 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E9=98=B2=E6=8A=96?=
 =?UTF-8?q?=EF=BC=8C=E4=BC=98=E5=8C=96=E6=97=A5=E5=BF=97=E9=A1=B5=E7=9A=84?=
 =?UTF-8?q?=E8=87=AA=E5=8A=A8=E6=BB=9A=E5=8A=A8=E4=BD=93=E9=AA=8C=20(#654)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/routes/logs/+page.svelte | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/web/src/routes/logs/+page.svelte b/web/src/routes/logs/+page.svelte
index d38ec29..a60c500 100644
--- a/web/src/routes/logs/+page.svelte
+++ b/web/src/routes/logs/+page.svelte
@@ -1,22 +1,24 @@
 <script lang="ts">
 	import api from '$lib/api';
 	import { setBreadcrumb } from '$lib/stores/breadcrumb';
-	import { onMount } from 'svelte';
+	import { onMount, tick } from 'svelte';
 	import { Badge } from '$lib/components/ui/badge';
 
 	let unsubscribeLog: (() => void) | null = null;
 	let logs: Array<{ timestamp: string; level: string; message: string }> = [];
 	let shouldAutoScroll = true;
 	let main: HTMLElement | null = null;
+	let scrollTimer: ReturnType<typeof setTimeout> | null = null;
 
 	function checkScrollPosition() {
 		if (main) {
 			const { scrollTop, scrollHeight, clientHeight } = main;
-			shouldAutoScroll = scrollTop + clientHeight >= scrollHeight - 5;
+			shouldAutoScroll = scrollTop + clientHeight >= scrollHeight - 50;
 		}
 	}
 
-	function scrollToBottom() {
+	async function scrollToBottom() {
+		await tick();
 		if (shouldAutoScroll && main) {
 			main.scrollTop = main.scrollHeight;
 		}
@@ -28,9 +30,11 @@
 		main?.addEventListener('scroll', checkScrollPosition);
 		unsubscribeLog = api.subscribeToLogs((data: string) => {
 			logs = [...logs.slice(-499), JSON.parse(data)];
-			setTimeout(scrollToBottom, 0);
+			if (scrollTimer) clearTimeout(scrollTimer);
+			scrollTimer = setTimeout(scrollToBottom, 20);
 		});
 		return () => {
+			if (scrollTimer) clearTimeout(scrollTimer);
 			main?.removeEventListener('scroll', checkScrollPosition);
 			if (unsubscribeLog) {
 				unsubscribeLog();