fix: batch markdown parsing with rAF to prevent UI freezes during streaming

Replaces per-chunk marked.lexer() calls with requestAnimationFrame batching,
reducing ~500 full parses per response to ~60 (one per frame). Eliminates
redundant KaTeX regex work that blocked the main thread.

Fixes open-webui#20878

Author: Algorithm5838

src/lib/components/chat/Messages/Markdown.svelte

@@ -1,5 +1,6 @@
 <script>
 	import { marked } from 'marked';
+	import { onDestroy } from 'svelte';
 	import { replaceTokens, processResponseContent } from '$lib/utils';
 	import { user } from '$lib/stores';
 
@@ -34,6 +35,7 @@
 	export let onTaskClick = () => {};
 
 	let tokens = [];
+	let parseFrame = null;
 
 	const options = {
 		throwOnError: false,
@@ -49,13 +51,24 @@
 		extensions: [mentionExtension({ triggerChar: '@' }), mentionExtension({ triggerChar: '#' })]
 	});
 
-	$: (async () => {
-		if (content) {
+	// Batch content updates into one parse per animation frame
+	function scheduleTokenize(text, modelName, userName) {
+		if (parseFrame) cancelAnimationFrame(parseFrame);
+		parseFrame = requestAnimationFrame(() => {
+			parseFrame = null;
 			tokens = marked.lexer(
-				replaceTokens(processResponseContent(content), model?.name, $user?.name)
+				replaceTokens(processResponseContent(text), modelName, userName)
 			);
-		}
-	})();
+		});
+	}
+
+	$: if (content) {
+		scheduleTokenize(content, model?.name, $user?.name);
+	}
+
+	onDestroy(() => {
+		if (parseFrame) cancelAnimationFrame(parseFrame);
+	});
 </script>
 
 {#key id}