https://github.com/surrealdb-community/surrealdb.worker

https://github.com/surrealdb-community/surrealdb.worker

Last synced: 21 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/surrealdb-community/surrealdb.worker
• Owner: surrealdb-community
• Created: 2022-09-27T05:50:52.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-10-11T15:05:41.000Z (about 1 month ago)
• Last Synced: 2024-10-22T23:52:11.790Z (25 days ago)
• Language: TypeScript
• Size: 82 KB
• Stars: 7
• Watchers: 1
• Forks: 0
• Open Issues: 11
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# SurrealDB in worker!

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-)

## WHY?

The main thread is full of stuff that don't need to be there. Also when you have

an Application where each client connects via WebSocket to SurrealDB that will

be a lot of open connections.

This package enables you to use 1 Connection per browser (NOT per tab). All

Connection related stuff (basicly most querys) has to be moved into a single

config object that lives in the Worker.

> NOTE: If the browser of the user supports SharedWorker it is a good idea to

> use it!

![model of surrealdb.worker](./model.png)

## Live Querys

This is build with live querys in mind so as soon as they are available they are

added here.

## Browser support

This needs the Lock API! See https://caniuse.com/mdn-api_lock for support.

## Size

Uncompressed (but minified) you add arround 5KB to your page. With gzip or

brotli you get that to 1-2KB!

## In worker

```ts

import { setupWorker } from "surrealdb.worker/dist/worker.js";

export const config = {

  query: {

    name: (con: Surreal) => {

      // We get the db connection instance and have 

      // to return a promise of X or X where X is 

      // a JSON-stringifyable object

    }

  },

  live: {

    name: (con: Surreal) => {

      // We get the db connection instance and have 

      // to return a promise of X or X where X is 

      // a Live instance (from surrealdb.js)

    }

  }

};

setupWorker(config).then((init) => {

  // When this runs the Worker only exists once!

  // This only runs again (in a different worker) if

  // The worker is killed (because tab closed + SharedWorker not supported)

  init('http://localhost:8000/rpc'); 

});

```

## In client to start worker

```ts

import { startWorker } from "surrealdb.worker/dist/worker.setup.js";

startWorker(new URL("./path/to/worker/file", import.meta.url));

```

## in client to setup cliet

```ts

import { config } from "./path/to/worker/file";

import { setupClient } from "surrealdb.worker/dist/client.js";

const client = setupClient();

// For vue

import { vue } from "surrealdb.worker/dist/framework/vue.js";

const vueClient = vue(client);

```

To call a function from the client just run

```ts

client.query.name(/* my args */)

client.live.name(/* my args */)

```

Same is true for the vue and the react client wrapper they just return something different.

### Performance

You should only create 1 client per tab! And each tab should call `startWorker`.

## Frameworks

As I will use this with Vue I added a wrapper for that. I also added a react

wrapper but I don't know if that works / what the best practices for that are.

You want to add other frameworks? Feel free to create a PR for this!

## Multiple Worker

If you have multiple surrealdb instances you want to connect to or have different workers you can add a name argument to the `setupWorker`, `startWorker` and `setupClient` calls.

## Vite support

You can import a small vite plugin:

```ts

import surrealdbWorker from "surrealdb.worker/vite/plugin.js"

export default {

  /*... */

  plugins: [

    /*... */

    surrealdbWorker()

    /*... */

  ],

  /*... */

}

```

This allowes imports like this:

```ts

import setup from 'sdb.w:default:./path/to/worker/file'

const promiseThatNeverResolves = setup()

```

## Why imports like `surrealdb.worker/dist/...`

This makes it a lot more easy to have multiple entrypoints for this package!

## Contributors ✨

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

  

    

      
Sebastian Krüger
💻 🚧

    

  

  

    

  

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!