-
Notifications
You must be signed in to change notification settings - Fork 231
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add lock to indexeddb vfs so that the database can only be opened once. #85
Comments
Thanks for the report, could you let me know what React framework and build tooling you are using? the Does this happen in all web browsers or only a specific one? |
I test the code on NextJS, RemixJS and Vite+React, all 3 the same error. I was using Chrome (Windows). |
Could you check if there is an indexeddb via the Chrome dev tools, if there is one delete it and refresh the app. It may be that the state of the database is broken, I'm suspicious that the initdb phase didn't complete when you first ran the code. Alternatively change the name of the database so that it creates a new one. |
Not sure where the errors is comming from, is also happening on stackblitz: https://stackblitz.com/edit/react-pglite-bug-rcynzw?file=src%2FApp.tsx
|
Hey @Neo-Ciber94 I've found the problem, it's due to React strict mode. Essentially PGlite is initiated twice for the same database, the first time it creates the indexeddb database to store the files, the second time it sees the database is there and so thinks it doesn't have to initiate it. However the first run hasn't completed and so the database doesn't exist. I commented out the strict mode on this fork: https://stackblitz.com/edit/react-pglite-bug-rcynzw-cwupa2?file=src%2FApp.tsx It's one of the occasions where you almost certainly don't want strict mode to init the postgres twice as it's such a cpu heavy operation, even for development. I would recommend explicitly only having a single instance of PGlite, example here (and below): https://stackblitz.com/edit/react-pglite-bug-rcynzw-bzsd5x?file=src%2FApp.tsx,src%2Fmain.tsx,src%2Findex.css We should look at having a lock so that only one instance of the database can be opened at once with indexeddb and throw an error if it can't be acquired. I'm going to use this issue to track that. import { PGlite } from '@electric-sql/pglite';
import { useState, useEffect } from 'react';
const DATA_DIR = 'idb://somedatabase2';
let client: PGlite;
export default function App() {
const [data, setData] = useState<unknown>('PENDING');
useEffect(() => {
(async () => {
client ??= new PGlite(DATA_DIR, { debug: 1 });
const result = await client.exec('SELECT NOW()');
setData(result);
})();
}, []);
return (
<div>
<h1>PGLite</h1>
<pre>{JSON.stringify(data, null, 2)}</pre>
</div>
);
} |
@samwillis You are totally right, looks like Ensuring the instance is created only once solve the issue for me. I really appreciate your help, Thank you! |
Perhaps we could provide a PGlite.createOnce() function or similar, which would return the same instance no matter how many times it’s called. |
@thruflo i like that. Ideally we should use a weak map to store the references to previously open databases so they can be cleanly garbage collected without having to explicitly close it to remove any reference. |
If a Also is there anything to consider to support workers? Maybe we need a |
Just a thought within the context of React, have we considered initiating the PG instance outside of the react component? With React 18, we can add a Suspense as well if you wish to have a loading state. Disabling StrictMode simply to ensure PG instance is initiated once, to me, feels like going against the very reason why StrictMode was implemented in the first place.
|
Each time I try to use the
IndexedDb
I get this error.this.program: could not access the server configuration file "/pgdata/postgresql.conf": No such file or directory
This is the code that trigger it:
The app halts, the error cannot be caught, so is not possible to do anything.
The text was updated successfully, but these errors were encountered: