Skip to content

useLiveQuery with pgvector issues #829

@GyulaSipos

Description

@GyulaSipos

I have pglite with react hooks in browser context, using vite, like so:

	"@electric-sql/pglite": "^0.3.11",
	"@electric-sql/pglite-react": "^0.2.29",
	"@electric-sql/pglite-sync": "^0.3.15",

i have it excluded from optimisation:

optimizeDeps: {
	exclude: ['@electric-sql/pglite'],
},

I try to run any query with pgvector it fails. Example code is taken directly from the pgvector repo readme.md:

import { useLiveQuery, usePGlite } from "@electric-sql/pglite-react";

export default function VectorTest() {
    console.log('starting vector test')
    const db = usePGlite()
    db.exec(`CREATE TABLE IF NOT EXISTS items (id bigserial PRIMARY KEY, embedding vector(3));`);
    db.exec(`INSERT INTO items (embedding) VALUES ('[1,2,3]'), ('[4,5,6]');`)
    const result = useLiveQuery(`SELECT * FROM items ORDER BY embedding <-> '[3,1,2]' LIMIT 5;`);
    console.log('ending vector test with result:')
    console.log(JSON.stringify(result));
    return <p>{result}</p>
}

this is my db setup:

export const db = await PGlite.create({
    debug: 4,
    database: 'idb://meal_planner',
    initialMemory: 64 * 1024 * 1024,
    extensions: {
        electric: electricSync(),
        live,
        vector,
        pg_trgm,
    },
})

and of course i have:
await db.exec('CREATE EXTENSION IF NOT EXISTS vector;')

running the same setup with the same queries in a docker postgres instance works through dBeaver.

Yet, in the browser, first run i just get the last log message:
runExec CREATE OR REPLACE TEMP VIEW live_query_64646cdf75b5406699aaa666d4d8af1f_view AS SELECT * FROM items ORDER BY embedding <-> '[3,1,2]' LIMIT 5

Then it freezes the browser tab (Arc) so bad, i cannot even close it, i have to close the entire browser. Upon reopening the brower and opening up the tab again the console writes:

runExec BEGIN undefined

runExec CREATE OR REPLACE TEMP VIEW live_query_64646cdf75b5406699aaa666d4d8af1f_view AS SELECT * FROM items ORDER BY embedding <-> '[3,1,2]' LIMIT 5; undefined

runExec ROLLBACK undefined

2025-10-26 06:41:31.683 GMT [0] ERROR: cannot drop active portal "" at character 9

2025-10-26 06:41:31.683 GMT [0] STATEMENT: ROLLBACK

runExec BEGIN undefined

2025-10-26 06:41:31.690 GMT [0] ERROR: current transaction is aborted, commands ignored until end of transaction block

2025-10-26 06:41:31.690 GMT [0] STATEMENT: BEGIN

Uncaught (in promise) error: current transaction is aborted, commands ignored until end of transaction block

runExec BEGIN undefined

2025-10-26 06:41:31.773 GMT [0] ERROR: current transaction is aborted, commands ignored until end of transaction block

2025-10-26 06:41:31.773 GMT [0] STATEMENT: BEGIN

Uncaught (in promise) error: current transaction is aborted, commands ignored until end of transaction block

And thats going on in a loop

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions