Demo showing how to sync data with ElectricSQL from Postgres to Cloudflare's Workers KV
Edge Workers often need instant access to Postgres data.
The typical options are poor:
- Querying to the db is slow.
- Maintaining a cache isn't ideal as you either need to hook up cache invalidation or accept stale data.
Sync Engines like ElectricSQL are a systematic fix to these sorts of "I want an up-to-date copy of some Postgres data in this other system". Electric lets you subscribe to what we call a shape, which is basically a table with a where clause, and then any changes to the database within that shape will be sent to subscribers
Check out the demo (sound on).
kv-sync-demo-sm.mp4
The sync code is in kv-sync.ts and worker code in worker.ts.
To run this locally.
- clone
npm install- start the PG/Electric backends (Docker should be installed)
npm run backend:up - start the worker:
npm run start - start the syncer:
npm run sync(note, the port of the worker is hard-coded but might be different on your machine). Open the worker in the browser to see what port it's on. - curl the worker
curl http://localhost:65094/— you should get back an empty array. - Insert some organizations:
insert into
organizations (
name,
address,
city,
state,
postal_code,
country,
phone_number,
email,
website
)
values
(
'Tech Innovators Inc.',
'123 Tech Lane',
'San Francisco',
'CA',
'94105',
'USA',
'415-555-1234',
'info@techinnovators.com',
'www.techinnovators.com'
),
(
'Green Solutions LLC',
'456 Greenway Blvd',
'Austin',
'TX',
'78701',
'USA',
'512-555-5678',
'contact@greensolutions.com',
'www.greensolutions.com'
),
(
'Health First Corp.',
'789 Wellness Ave',
'New York',
'NY',
'10001',
'USA',
'212-555-9012',
'support@healthfirst.com',
'www.healthfirst.com'
);- Curl again — you should see the data. Then try updating a field or two and deleting an org and curl to see how the data is instantly synced.