From 9b35a0a9438e12b42687a9833c16abaea1f2a1aa Mon Sep 17 00:00:00 2001
From: tudor <tdrz@zaharia.ch>
Date: Mon, 5 Jan 2026 13:53:36 +0100
Subject: [PATCH 1/2] create table inside worker init

---
 packages/pglite/examples/worker-process.js |  8 +++++++
 packages/pglite/examples/worker.html       | 25 ++++++++--------------
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/packages/pglite/examples/worker-process.js b/packages/pglite/examples/worker-process.js
index 585dfa776..544bdbb5c 100644
--- a/packages/pglite/examples/worker-process.js
+++ b/packages/pglite/examples/worker-process.js
@@ -10,6 +10,14 @@ worker({
       },
     })
     // If you want run any specific setup code for the worker process, you can do it here.
+    console.log('Creating table...')
+    await pg.exec(`
+  CREATE EXTENSION IF NOT EXISTS vector;
+  CREATE TABLE IF NOT EXISTS test (
+    id SERIAL PRIMARY KEY,
+    data vector(3)
+  );
+`)    
     return pg
   },
 })
diff --git a/packages/pglite/examples/worker.html b/packages/pglite/examples/worker.html
index c81f28864..b026bd0bd 100644
--- a/packages/pglite/examples/worker.html
+++ b/packages/pglite/examples/worker.html
@@ -45,7 +45,6 @@ <h2>Main Thread</h2>
         <script type="module">
           import { PGliteWorker } from '@electric-sql/pglite/worker'
           import { live } from '@electric-sql/pglite/live'
-
           console.log('Creating worker...')
           const pg = new PGliteWorker(
             new Worker(new URL('./worker-process.js', import.meta.url), {
@@ -64,19 +63,12 @@ <h2>Main Thread</h2>
               const leader = document.getElementById('leader')
               leader.textContent = 'true'
               leader.style.color = 'green'
+
             }
+            console.log('Leader has changed, clearing output ...')
+            output.textContent = ''
           })
 
-          console.log('Creating table...')
-
-          await pg.exec(`
-  CREATE EXTENSION IF NOT EXISTS vector;
-  CREATE TABLE IF NOT EXISTS test (
-    id SERIAL PRIMARY KEY,
-    data vector(3)
-  );
-`)
-
           console.log('Ready!')
 
           async function insertData() {
@@ -96,11 +88,12 @@ <h2>Main Thread</h2>
           const btnClear = document.querySelector('#clear')
           btnClear.addEventListener('click', clearData)
 
-          // pg.live.query(
-          pg.live.incrementalQuery(`SELECT * FROM test`, [], 'id', (data) => {
-            const output = document.getElementById('output')
-            output.textContent = JSON.stringify(data.rows, null, 2)
-          })
+          setTimeout(async () => {
+            let incResult = await pg.live.incrementalQuery(`SELECT * FROM test`, [], 'id', (data) => {
+              const output = document.getElementById('output')
+              output.textContent = JSON.stringify(data.rows, null, 2)
+            })
+          }, 500)
         </script>
       </div>
       <div id="log"></div>

From 4ca06dbb954a3d5d1b9d71d3397531f0ade44821 Mon Sep 17 00:00:00 2001
From: tudor <tdrz@zaharia.ch>
Date: Tue, 6 Jan 2026 12:46:28 +0100
Subject: [PATCH 2/2] use indexdb storage for example; resubscribe to
 incremental updates

---
 packages/pglite/examples/worker-process.js |  1 +
 packages/pglite/examples/worker.html       | 10 +++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/pglite/examples/worker-process.js b/packages/pglite/examples/worker-process.js
index 544bdbb5c..9bc36d954 100644
--- a/packages/pglite/examples/worker-process.js
+++ b/packages/pglite/examples/worker-process.js
@@ -5,6 +5,7 @@ import { vector } from '../dist/vector/index.js'
 worker({
   async init() {
     const pg = new PGlite({
+      dataDir: 'idb://my-pgdata',
       extensions: {
         vector,
       },
diff --git a/packages/pglite/examples/worker.html b/packages/pglite/examples/worker.html
index b026bd0bd..faf5bdb06 100644
--- a/packages/pglite/examples/worker.html
+++ b/packages/pglite/examples/worker.html
@@ -67,6 +67,13 @@ <h2>Main Thread</h2>
             }
             console.log('Leader has changed, clearing output ...')
             output.textContent = ''
+            setTimeout(async () => {
+              console.log('requesting incrementalQuery')
+              let incResult = await pg.live.incrementalQuery(`SELECT * FROM test`, [], 'id', (data) => {
+                const output = document.getElementById('output')
+                output.textContent = JSON.stringify(data.rows, null, 2)
+              })
+          }, 200)
           })
 
           console.log('Ready!')
@@ -90,10 +97,11 @@ <h2>Main Thread</h2>
 
           setTimeout(async () => {
             let incResult = await pg.live.incrementalQuery(`SELECT * FROM test`, [], 'id', (data) => {
+              console.log('requesting incrementalQuery')
               const output = document.getElementById('output')
               output.textContent = JSON.stringify(data.rows, null, 2)
             })
-          }, 500)
+          }, 200)
         </script>
       </div>
       <div id="log"></div>