openpencil/tests/engine/app/document/recovery/controller.test.ts
Danila Poyarkov cb075b3e1a
perf: speed up opening large pages (#953)
* perf(canvas): find guide owners from an index instead of walking the page

Drawing and hit-testing guides visited every layer of the page on each frame to find the few that carry guides; on a large page that took about 1.2s of a load's rendering. The graph now keeps the set of layers with guides current from its node events, and both read it.

* perf(layout): write only changed geometry and request one render per layout pass

Layout wrote every laid-out layer's geometry whether or not it changed, so each pass over a large page notified every graph listener for every layer; a page load spent about 1s handling those updates. Layout now writes only the fields that changed, and the updates a layout pass makes ask for a single render, queued for before the next frame, instead of bumping the editor's reactive versions once per layer.

* test(canvas): drop the graph double the guide tests no longer use

* perf(fig): copy an opened file once on the main thread instead of three times

Opening a .fig in the browser copied the file for a main-thread fallback the caller's buffer already served, then copied it twice more for the worker, which parses from one and keeps the other as the original archive. A 109MB file briefly took over 400MB on the main thread. The fallback now reuses the caller's buffer, and the worker receives one copy and makes its archive copy itself.

* docs(changelog): note faster large-page loads

* fix(app): run recovery and autosave after edits, not redraws

Recovery and autosave watched sceneVersion, a render counter that every
requestRender bumps: opening a file, layout passes, fonts, and each layer a
page loads. Safari has no File System Access API, so its opened files have
no writable source and always get recovery snapshots. Loading a page also
invalidated the original archive, so a snapshot encoded the whole document
again; on the Preline UI kit's CMS page that ran about 100 s on the main
thread in WebKit before failing.

Recovery, autosave, and saved versions now follow the content revision of
createDocumentChanges. A page's layers loading from the opened file, which
runs inside applyImportedStateDuring on both the worker and main-thread
paths, no longer counts as an edit for that revision or for the original
archive, and asks for one render rather than one per layer.

In WebKit the CMS page switch drops from 105-133 s to 21 s, and its longest
main-thread stall from 90-117 s to 1.4 s.

* refactor(app): stop storing a version with recovery snapshots

Adopting a snapshot now protects the document's current content revision,
so nothing reads the version a snapshot was taken at. Snapshots saved by
earlier versions carry a sceneVersion field instead; dropping the field
keeps the metadata type true for both. Tests tell snapshots apart by the
bytes they were built with.
2026-10-07 20:57:57 +00:00

323 lines
9.9 KiB
TypeScript

import { describe, expect, test } from 'bun:test'
import { reactive, ref } from 'vue'
import { createEditor } from '@open-pencil/core/editor'
import { createDocumentChanges } from '@/app/document/io/changes'
import { createDocumentRecovery } from '@/app/document/recovery/controller'
import { createMemoryRecoveryStore } from '@/app/document/recovery/memory'
import type { RecoverySnapshotInput, RecoveryStore } from '@/app/document/recovery/types'
function deferredWriteStore() {
const memory = createMemoryRecoveryStore()
let release: (() => void) | null = null
const store: RecoveryStore = {
...memory,
async write(input: RecoverySnapshotInput) {
await new Promise<void>((resolve) => {
release = resolve
})
return memory.write(input)
}
}
return { store, release: () => release?.() }
}
function deferredRemoveStore() {
const memory = createMemoryRecoveryStore()
let release: (() => void) | null = null
const store: RecoveryStore = {
...memory,
async remove(id: string) {
await new Promise<void>((resolve) => {
release = resolve
})
await memory.remove(id)
}
}
return { store, release: () => release?.() }
}
/** Snapshots built by default hold the version they were built at, to show which one was kept. */
function setup(
buildFigFile?: () => Promise<Uint8Array>,
initialEnabled = true,
injectedStore?: RecoveryStore
) {
const state = reactive({ documentName: 'Agent draft' })
const version = ref(0)
const store = injectedStore ?? createMemoryRecoveryStore()
let writable = false
const enabled = ref(initialEnabled)
const recovery = createDocumentRecovery({
state,
version: () => version.value,
store,
recoveryId: 'recovery-1',
hasWritableSource: () => writable,
isEnabled: () => enabled.value,
buildFigFile: buildFigFile ?? (async () => new Uint8Array([version.value]))
})
return {
version,
store,
recovery,
setWritable: (value: boolean) => (writable = value),
setEnabled: (value: boolean) => (enabled.value = value)
}
}
describe('document recovery controller', () => {
test('persists source-less changes and skips untouched documents', async () => {
const { version, store, recovery } = setup()
await recovery.persistNow()
expect(await store.list()).toEqual([])
version.value = 1
await recovery.persistNow()
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(1)
recovery.disposeRecovery()
})
test('does not serialize or persist while disabled', async () => {
let builds = 0
const { version, store, recovery } = setup(async () => {
builds++
return new Uint8Array([1])
}, false)
version.value = 1
await recovery.persistNow()
expect(builds).toBe(0)
expect(await store.list()).toEqual([])
recovery.disposeRecovery()
})
test('removes the owned snapshot when disabled and resumes from the current version', async () => {
const { version, store, recovery, setEnabled } = setup()
version.value = 1
await recovery.persistNow()
expect(await store.list()).toHaveLength(1)
setEnabled(false)
await Promise.resolve()
await Promise.resolve()
expect(await store.list()).toEqual([])
version.value = 2
setEnabled(true)
await recovery.persistNow()
expect(await store.list()).toEqual([])
version.value = 3
await recovery.persistNow()
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(3)
recovery.disposeRecovery()
})
test('waits for disable cleanup before writing after re-enable', async () => {
const deferred = deferredRemoveStore()
const { version, store, recovery, setEnabled } = setup(undefined, true, deferred.store)
version.value = 1
await recovery.persistNow()
setEnabled(false)
setEnabled(true)
version.value = 2
const nextWrite = recovery.persistNow()
await Promise.resolve()
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(1)
deferred.release()
await nextWrite
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(2)
recovery.disposeRecovery()
})
test('does not persist documents with writable sources', async () => {
const { version, store, recovery, setWritable } = setup()
setWritable(true)
version.value = 1
await recovery.persistNow()
expect(await store.list()).toEqual([])
recovery.disposeRecovery()
})
test('recovery coalesces 100 changes during encoding to the latest version', async () => {
let release: (() => void) | null = null
let calls = 0
const { version, store, recovery } = setup(async () => {
calls++
if (calls === 1) {
await new Promise<void>((resolve) => {
release = resolve
})
}
return new Uint8Array([version.value])
})
version.value = 1
const pending = recovery.persistNow()
await Promise.resolve()
for (let next = 2; next <= 101; next++) {
version.value = next
void recovery.persistNow()
}
const releaseFirst = () => {
if (release) release()
}
releaseFirst()
await pending
expect(calls).toBe(2)
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(101)
recovery.disposeRecovery()
})
test('propagates persistence failures to close and reload callers', async () => {
const state = reactive({ documentName: 'Draft' })
const version = ref(0)
const store = createMemoryRecoveryStore()
const memoryWrite = store.write.bind(store)
let writeAttempts = 0
store.write = async (input) => {
writeAttempts++
if (writeAttempts === 1) throw new Error('recovery storage unavailable')
return memoryWrite(input)
}
const recovery = createDocumentRecovery({
state,
version: () => version.value,
store,
recoveryId: 'recovery-1',
hasWritableSource: () => false,
buildFigFile: () => new Uint8Array([version.value])
})
version.value = 1
await expect(recovery.persistNow()).rejects.toThrow('recovery storage unavailable')
await recovery.persistNow()
expect(writeAttempts).toBe(2)
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(1)
recovery.disposeRecovery()
})
test('successful save removes recovery data', async () => {
const { version, store, recovery } = setup()
version.value = 1
await recovery.persistNow()
expect(await store.list()).toHaveLength(1)
await recovery.markProtectedVersion(1)
expect(await store.list()).toEqual([])
recovery.disposeRecovery()
})
test('save waits for an active write before deleting its snapshot', async () => {
const deferred = deferredWriteStore()
const state = reactive({ documentName: 'Draft' })
const version = ref(0)
const recovery = createDocumentRecovery({
state,
version: () => version.value,
store: deferred.store,
recoveryId: 'recovery-1',
hasWritableSource: () => false,
buildFigFile: () => new Uint8Array([1])
})
version.value = 1
const write = recovery.persistNow()
await Promise.resolve()
const cleanup = recovery.markProtectedVersion(1)
deferred.release()
await Promise.all([write, cleanup])
expect(await deferred.store.list()).toEqual([])
recovery.disposeRecovery()
})
test('discard waits for an active write before deleting its snapshot', async () => {
const deferred = deferredWriteStore()
const state = reactive({ documentName: 'Draft' })
const version = ref(0)
const recovery = createDocumentRecovery({
state,
version: () => version.value,
store: deferred.store,
recoveryId: 'recovery-1',
hasWritableSource: () => false,
buildFigFile: () => new Uint8Array([1])
})
version.value = 1
const write = recovery.persistNow()
await Promise.resolve()
const discard = recovery.discardRecovery()
deferred.release()
await Promise.all([write, discard])
expect(await deferred.store.list()).toEqual([])
recovery.disposeRecovery()
})
test('adoption waits for an active write and removes the previous recovery id', async () => {
const deferred = deferredWriteStore()
const state = reactive({ documentName: 'Draft' })
const version = ref(0)
const recovery = createDocumentRecovery({
state,
version: () => version.value,
store: deferred.store,
recoveryId: 'previous',
hasWritableSource: () => false,
buildFigFile: () => new Uint8Array([1])
})
version.value = 1
const write = recovery.persistNow()
await Promise.resolve()
const adoption = recovery.adoptRecoverySnapshot('recovered')
deferred.release()
await Promise.all([write, adoption])
expect(recovery.getRecoveryId()).toBe('recovered')
expect(await deferred.store.read('previous')).toBeNull()
recovery.disposeRecovery()
})
test('preserves a snapshot newer than the saved version', async () => {
const { version, store, recovery } = setup()
version.value = 2
await recovery.persistNow()
await recovery.markProtectedVersion(1)
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(2)
recovery.disposeRecovery()
})
test('follows content edits, not render requests', async () => {
const editor = createEditor()
const changes = createDocumentChanges(editor)
const store = createMemoryRecoveryStore()
const recovery = createDocumentRecovery({
state: { documentName: 'Draft' },
version: changes.capture,
store,
recoveryId: 'recovery-1',
hasWritableSource: () => false,
buildFigFile: () => new Uint8Array([changes.capture()])
})
try {
for (let i = 0; i < 5; i++) editor.requestRender()
await recovery.persistNow()
expect(await store.list()).toEqual([])
editor.createShape('RECTANGLE', 0, 0, 100, 100)
await recovery.persistNow()
expect((await store.read('recovery-1'))?.figBytes[0]).toBe(changes.capture())
} finally {
recovery.disposeRecovery()
changes.dispose()
editor.dispose()
}
})
})