perf: extend fast-deep-equal to remaining call sites (#23845)

src/lib/components/chat/Chat.svelte

@@ -13,6 +13,7 @@
 	import { get, type Unsubscriber, type Writable } from 'svelte/store';
 	import type { i18n as i18nType } from 'i18next';
 	import { WEBUI_BASE_URL } from '$lib/constants';
+	import equal from 'fast-deep-equal';
 
 	import {
 		chatId,
@@ -277,7 +278,7 @@
 	};
 
 	let oldSelectedModelIds = [''];
-	$: if (JSON.stringify(selectedModelIds) !== JSON.stringify(oldSelectedModelIds)) {
+	$: if (!equal(selectedModelIds, oldSelectedModelIds)) {
 		onSelectedModelIdsChange();
 	}
 
@@ -674,7 +675,7 @@
 		if (
 			$selectedFolder &&
 			selectedModels.filter((modelId) => modelId !== '').length > 0 &&
-			JSON.stringify($selectedFolder?.data?.model_ids) !== JSON.stringify(selectedModels)
+			!equal($selectedFolder?.data?.model_ids, selectedModels)
 		) {
 			const res = await updateFolderById(localStorage.token, $selectedFolder.id, {
 				data: {
@@ -758,7 +759,7 @@
 			await tick();
 			if (
 				folder?.data?.model_ids &&
-				JSON.stringify(selectedModels) !== JSON.stringify(folder.data.model_ids)
+				!equal(selectedModels, folder.data.model_ids)
 			) {
 				selectedModels = folder.data.model_ids;
 
@@ -1836,7 +1837,7 @@
 		chatFiles = chatFiles.filter(
 			// Remove duplicates
 			(item, index, array) =>
-				array.findIndex((i) => JSON.stringify(i) === JSON.stringify(item)) === index
+				array.findIndex((i) => equal(i, item)) === index
 		);
 
 		// Create user message
@@ -1880,7 +1881,7 @@
 			$models.map((m) => m.id).includes(modelId) ? modelId : ''
 		);
 
-		if (JSON.stringify(selectedModels) !== JSON.stringify(_selectedModels)) {
+		if (!equal(selectedModels, _selectedModels)) {
 			selectedModels = _selectedModels;
 		}
 
@@ -2177,7 +2178,7 @@
 		// Remove duplicates
 		files = files.filter(
 			(item, index, array) =>
-				array.findIndex((i) => JSON.stringify(i) === JSON.stringify(item)) === index
+				array.findIndex((i) => equal(i, item)) === index
 		);
 
 		scrollToBottom();

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

@@ -15,6 +15,7 @@
 	} from '$lib/utils';
 
 	import 'highlight.js/styles/github-dark.min.css';
+	import equal from 'fast-deep-equal';
 
 	import CodeEditor from '$lib/components/common/CodeEditor.svelte';
 	import SvgPanZoom from '$lib/components/common/SVGPanZoom.svelte';
@@ -391,7 +392,7 @@
 	$: if (token) {
 		if (token.text !== _token?.text || token.raw !== _token?.raw) {
 			_token = token;
-		} else if (JSON.stringify(token) !== JSON.stringify(_token)) {
+		} else if (!equal(token, _token)) {
 			_token = token;
 		}
 	}

src/lib/components/chat/ModelSelector.svelte

@@ -6,6 +6,7 @@
 	import Tooltip from '../common/Tooltip.svelte';
 
 	import { updateUserSettings } from '$lib/apis/users';
+	import equal from 'fast-deep-equal';
 	const i18n = getContext('i18n');
 
 	export let selectedModels = [''];
@@ -43,7 +44,7 @@
 			$models.map((m) => m.id).includes(model) ? model : ''
 		);
 
-		if (JSON.stringify(_selectedModels) !== JSON.stringify(selectedModels)) {
+		if (!equal(_selectedModels, selectedModels)) {
 			selectedModels = _selectedModels;
 		}
 	}

src/lib/components/common/RichTextInput.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { marked } from 'marked';
 	import DOMPurify from 'dompurify';
+	import equal from 'fast-deep-equal';
 
 	marked.use({
 		breaks: true,
@@ -1257,7 +1258,7 @@
 		}
 
 		if (json) {
-			if (JSON.stringify(value) !== JSON.stringify(jsonValue)) {
+			if (!equal(value, jsonValue)) {
 				editor.commands.setContent(value);
 				selectTemplate();
 			}

src/lib/components/notes/NoteEditor.svelte

@@ -8,6 +8,7 @@
 
 	import { marked } from 'marked';
 	import { toast } from 'svelte-sonner';
+	import equal from 'fast-deep-equal';
 
 	import { goto } from '$app/navigation';
 
@@ -226,7 +227,7 @@
 	}
 
 	function areContentsEqual(a, b) {
-		return JSON.stringify(a) === JSON.stringify(b);
+		return equal(a, b);
 	}
 
 	function insertNoteVersion(note) {