FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
postpostscript
postpostscriptreactiveStateBlob
Public
Like
1
reactiveStateBlob
Home
Code
2
README.md
main.tsx
Branches
1
Pull requests
Remixes
History
Environment variables
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
Code
/
Search
README.md

reactiveStateBlob: wrap blob state in a proxy to autosave it on changes

Examples (full example at @postpostscript/reactiveStateBlobExample)

import { reactiveStateBlob } from "https://esm.town/v/postpostscript/reactiveStateBlob" using state = await reactiveStateBlob({ viewCount: 0, rows: [] as { x: number; y: number; }[], }); state.viewCount += 1; state.rows.push({ x: Math.random(), y: Math.random(), });

This infers the key from the name of the val that uses it. To specify it, pass the key option:

Create val
using state = await reactiveStateBlob({ viewCount: 0, rows: [] as { x: number; y: number; }[], }, { key: 'reactiveStateBlobExample.state', });

Updating Schema

If you want to update the schema, or always verify the state that is pulled from the job, pass a function as the first argument:

using state = await reactiveStateBlob((existingState) => { return { viewCount: (existingState.viewCount ?? 0) as number, rows: (existingState.rows ?? []) as { x: number; y: number; }[], someNewField: (existingState.someNewField ?? "") as string, } })

Options

using state = await reactiveStateBlob<{ value: number; }>({ value: 0, }, { log: true, // log when saving key: "blobKey", // blob key to fetch/save to timeout: 100, // ms, defaults to 10 lock: true, // or LockOptions (see https://www.val.town/v/postpostscript/lock#options) })

See Also

@postpostscript/counter (example at @postpostscript/counterExample)

Migrated from folder: State/reactiveStateBlob

Code
README.mdmain.tsx
Go to top
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Product
FeaturesPricing
Developers
DocsStatusAPI ExamplesNPM Package Examples
Explore
ShowcaseTemplatesNewest ValsTrending ValsNewsletter
Company
AboutBlogCareersBrandhi@val.town
Terms of usePrivacy policyAbuse contact
© 2025 Val Town, Inc.