perf(studio): virtualize the furniture table and throttle batch progress

- Render the table view through a virtualizer too, using a shared grid
  template so the sticky header and rows keep perfect column alignment
- Keep semantic table/row/cell elements while virtualizing
- Cap the batch item-details list to the latest 60 rows (newest first)
- Coalesce per-item progress events server-side (120ms throttle) in both
  the exact-import and clone SSE batch runners

src/app/api/admin/import/furni/batch/route.ts

@@ -117,6 +117,11 @@ export const POST = withAdmin(
 						});
 
 						try {
+							// Coalesce micro-step progress events to at most one per
+							// ~120ms per item so large imports don't flood the client
+							// (terminal states are always emitted by importSingleFurni
+							// and sent below).
+							let lastProgressSent = 0;
 							const result: ImportSingleResult = await importSingleFurni({
 								id: item.id ?? 0,
 								classname: item.classname,
@@ -131,6 +136,9 @@ export const POST = withAdmin(
 								nitroBaseUrl: source?.nitroBaseUrl,
 								iconBaseUrl: source?.iconBaseUrl,
 								onProgress: (status: string) => {
+									const now = Date.now();
+									if (now - lastProgressSent < 120) return;
+									lastProgressSent = now;
 									send({
 										type: "item_progress",
 										classname: item.classname,

src/components/admin/studio/batch-progress.tsx

@@ -73,7 +73,13 @@ export const BatchProgress = memo(function BatchProgress({
 		return () => clearInterval(id);
 	}, [done]);
 
-	const entries = useMemo(() => [...progress.values()], [progress]);
+	// Relevance-first list: newest activity on top, capped so high-volume
+	// imports don't render hundreds of DOM rows on every progress event.
+	const VISIBLE_ITEMS = 60;
+	const entries = useMemo(
+		() => [...progress.values()].slice().reverse(),
+		[progress],
+	);
 	const completed = useMemo(
 		() =>
 			entries.filter((i) => i.status === "done" || i.status === "failed")
@@ -239,7 +245,12 @@ export const BatchProgress = memo(function BatchProgress({
 					View item details ({total})
 				</summary>
 				<div className="mt-2 max-h-44 space-y-2 overflow-auto">
-					{entries.map((item) => (
+					{entries.length > VISIBLE_ITEMS && (
+						<p className="px-1 text-[0.65rem] text-[var(--admin-text-muted)]">
+							Showing {VISIBLE_ITEMS} of {entries.length} items
+						</p>
+					)}
+					{entries.slice(0, VISIBLE_ITEMS).map((item) => (
 						<div
 							key={item.classname}
 							className="flex items-start gap-2 rounded-md bg-[var(--admin-canvas)] p-2 text-xs"

src/lib/services/import/core/sse-batch.ts

@@ -79,9 +79,22 @@ export function runSseBatch<T>(opts: RunSseBatchOptions<T>): Response {
 							index,
 						});
 						try {
-							const result = await worker(item, index, (status) =>
-								send({ type: "item_progress", classname, status, index }),
-							);
+							// Coalesce micro-step progress ('downloading', 'converting',
+							// ...) to at most one per 120ms per item so large imports
+							// don't flood the client. Terminal states are emitted
+							// separately below.
+							let lastReportSent = 0;
+							const result = await worker(item, index, (status) => {
+								const now = Date.now();
+								if (now - lastReportSent < 120) return;
+								lastReportSent = now;
+								send({
+									type: "item_progress",
+									classname,
+									status,
+									index,
+								});
+							});
 							if (ac.signal.aborted) return;
 							if (result.ok) {
 								succeeded++;