Skip to main content
On this pageOverview

Slow View Warning

Overview

Every time your model changes, Foldkit calls your view function to build a virtual DOM tree describing what the screen should look like. Foldkit then diffs that tree against the previous one and patches the real DOM. The view call is only the first step — the diff, DOM patch, browser layout, and paint still happen after it returns.

During development, Foldkit measures how long the view call takes and warns in the console when it exceeds the frame budget. At 60fps the entire frame gets 16ms, so if view alone takes that long, you are already dropping frames before the DOM work even begins. The warning nudges you to move computation into update or memoize expensive subtrees with createLazy and createKeyedLazy.

The warning only runs in dev mode (gated behind import.meta.hot), so there is zero runtime cost in production builds.

The default threshold is 16ms (one frame at 60fps). Pass slowViewThresholdMs to makeElement or makeApplication to customize it:

import { Runtime } from 'foldkit'

const element = Runtime.makeElement({
  Model,
  init,
  update,
  view,
  container: document.getElementById('root')!,
  slowViewThresholdMs: 50,
})

Runtime.run(element)

Set slowViewThresholdMs to false to disable the warning entirely.