fix(language-core): avoid unrelated virtual code recomputes on style change

Author: KazariEX

packages/language-core/lib/utils/signals.ts

@@ -59,3 +59,19 @@ export function computedSet<T>(source: () => Set<T>): () => Set<T> {
 		}
 	);
 }
+
+export function computedItems<T>(
+	source: () => T[],
+	compareFn: (oldItem: T, newItem: T) => boolean
+) {
+	return computed<T[]>(
+		oldArr => {
+			oldArr ??= [];
+			const newArr = source();
+			if (oldArr.length === newArr.length && oldArr.every((item, index) => compareFn(item, newArr[index]))) {
+				return oldArr;
+			}
+			return newArr;
+		}
+	);
+}

packages/language-core/lib/virtualFile/computedSfc.ts

@@ -5,7 +5,7 @@ import type * as ts from 'typescript';
 import type { Sfc, SfcBlock, SfcBlockAttr, VueLanguagePluginReturn } from '../types';
 import { parseCssClassNames } from '../utils/parseCssClassNames';
 import { parseCssVars } from '../utils/parseCssVars';
-import { computedArray } from '../utils/signals';
+import { computedArray, computedItems } from '../utils/signals';
 
 export function computedSfc(
 	ts: typeof import('typescript'),
@@ -116,8 +116,14 @@ export function computedSfc(
 			const base = computedSfcBlock('style_' + i, 'css', getBlock);
 			const getModule = computedAttrValue('__module', base, getBlock);
 			const getScoped = computed(() => !!getBlock().scoped);
-			const getCssVars = computed(() => [...parseCssVars(base.content)]);
-			const getClassNames = computed(() => [...parseCssClassNames(base.content)]);
+			const getCssVars = computedItems(
+				() => [...parseCssVars(base.content)],
+				(oldItem, newItem) => oldItem.text === newItem.text && oldItem.offset === newItem.offset
+			);
+			const getClassNames = computedItems(
+				() => [...parseCssClassNames(base.content)],
+				(oldItem, newItem) => oldItem.text === newItem.text && oldItem.offset === newItem.offset
+			);
 			return () => mergeObject(base, {
 				get module() { return getModule(); },
 				get scoped() { return getScoped(); },