Claude
5fdcf8cb56
Large folders/collections rendered every row into the DOM, so memory and scripting time grew linearly with item count. A 20k-row list took ~12.5s to first paint, held ~380k DOM nodes / ~281MB JS heap, and scrolled at ~4fps. Add a reusable, dependency-free `VirtualList` that windows rows against the nearest scrollable ancestor (the existing `.content-area`), so the single-scrollbar UX, sticky header and end-of-list sentinel are unchanged. It reserves the full scroll height with a sized spacer and translates a small window of rows; row height is auto-measured for the single-column case. Wire it into ResourceList's flat list view (recent, favorites, shared, shared-with-me, trash, search). Grouped sections and grid view are unchanged for now and are the next callers of the same primitive. Measured in headless Chromium (1280x900) with synthetic rows, before/after: rows | mount→paint | DOM nodes | JS heap | scroll frame | jank frames ------+-------------+-----------+---------+--------------+------------ 1000 | 632→70 ms | 19k→351 | 16→2 MB | 17→17 ms | 0→0 5000 | 4401→54 ms | 95k→351 | 72→3 MB | 47→17 ms | 136→0 20000 | 12577→56 ms | 380k→351 |281→6 MB |258→17 ms | 1443→0 Rendered DOM and heap are now flat (O(visible)) regardless of dataset size; scroll holds 60fps with zero jank. Correctness verified by probing a mid-list scroll (rows land at the expected indices, positioned within the viewport). eslint: disable core `no-undef` for `.svelte` (TypeScript/svelte-check already resolve identifiers, including `<script generics>` type params it can't see). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01M8Vb9QHmLZnEMzHz7MrFy6
40 lines
979 B
JavaScript
40 lines
979 B
JavaScript
import js from '@eslint/js';
|
|
import svelte from 'eslint-plugin-svelte';
|
|
import prettier from 'eslint-config-prettier';
|
|
import globals from 'globals';
|
|
import ts from 'typescript-eslint';
|
|
|
|
export default ts.config(
|
|
js.configs.recommended,
|
|
...ts.configs.recommended,
|
|
...svelte.configs['flat/recommended'],
|
|
prettier,
|
|
...svelte.configs['flat/prettier'],
|
|
{
|
|
languageOptions: {
|
|
globals: {
|
|
...globals.browser,
|
|
...globals.node
|
|
}
|
|
}
|
|
},
|
|
{
|
|
files: ['**/*.svelte'],
|
|
languageOptions: {
|
|
parserOptions: {
|
|
parser: ts.parser
|
|
}
|
|
},
|
|
// TypeScript + svelte-check already resolve identifiers (including `<script
|
|
// generics>` type params, which core `no-undef` can't see). Defer to them.
|
|
rules: {
|
|
'no-undef': 'off'
|
|
}
|
|
},
|
|
{
|
|
// `static/` holds vendored, verbatim assets (the delta-upload worker and
|
|
// the wasm-bindgen hash glue) — lint them as the upstream ships them.
|
|
ignores: ['build/', '.svelte-kit/', 'package/', 'static/', 'bench/']
|
|
}
|
|
);
|