Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Every playground store update rewrites about 1.4 MB of built-in examples to IndexedDB

Open
  • Is something wrong?
#1,756 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
58/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
nodejs, react, typescript
Domain
database, performance

Research direction

Start with apps/playground/src/store/index.ts and its persistence tests in apps/playground/src/store/__tests__/index.test.ts; inspect how partialize, merge, and migration handle stored instruments. Then read apps/playground/src/hooks/useEditorErrorSync.ts and check how marker and file updates trigger error writes. Verify the test confirms only saved instruments and the selected ID are persisted, and that the legacy stored shape is handled.

Written by the indexing model from the issue text.

Description

Area: Playground Difficulty: Low Enhancement Performance Priority: Medium

Every playground store update rewrites about 1.4 MB of built-in example instruments to IndexedDB, and a single keystroke causes several such writes. partialize persists the whole instruments list and the whole selectedInstrument. But merge keeps only Saved instruments and the selected instrument's id when it loads, so everything else written is thrown away on the next load. The examples carry base64 media (cat-video.mp4, cow-moo.mp3, smiley.png, …). Serialized the way partialize writes them, the current src/instruments catalog alone is 1,434,683 bytes, plus the selected instrument's files a second time. Zustand's persist writes on every set. One keystroke triggers updateFile, then setEditorErrors from useEditorErrorSync's files subscription (always a new array, even when nothing changed), then setEditorErrors again when Monaco's markers update. Each rebuild adds building and built. Typing for a minute serializes and writes hundreds of megabytes to IndexedDB, nearly all of it discarded data.

Where

apps/playground/src/store/index.ts:77-83:

partialize: (state) => {
  return {
    ...pick(state, ['instruments', 'selectedInstrument', 'settings']),
    _accessToken: state.auth?.accessToken
  };
},

apps/playground/src/hooks/useEditorErrorSync.ts:31-37:

const refresh = () => {
  const filenames = useAppStore.getState().files.map((file) => file.name);
  setEditorErrors(collectEditorErrors(monaco, filenames));
};
refresh();
const markersListener = monaco.editor.onDidChangeMarkers(refresh);
const unsubscribeFromFiles = useAppStore.subscribe((store) => store.files, refresh);

Reproduce

Mechanism and scale: open DevTools > Application > IndexedDB > keyval-store > keyval, type in the editor, and watch the app entry. It is rewritten with the full ~1.4 MB catalog several times per keystroke. The size grows with every example or template that gains an asset, and with each saved instrument.

Tests

apps/playground/src/store/__tests__/index.test.ts (mock idb-keyval): it('should persist only saved instruments and the selected instrument's id, so built-in examples are never written to IndexedDB'). No end-to-end test: the change affects only what is stored, and the existing playground specs cover reload behaviour.

Suggested fix

Persist instruments.filter((instrument) => instrument.category === 'Saved') and selectedInstrument.id rather than the full object, and bump version with a migrate for the old shape. In useEditorErrorSync, skip setEditorErrors when the collected errors equal the current ones.

Dominant language
TypeScript
Stars
119
Forks
19
Avg merge
1d 2h
Merged PRs (30d)
56

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from DouglasNeuroInformatics/OpenDataCapture

All issues in DouglasNeuroInformatics/OpenDataCapture

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.