1- How to enable image support while using yjs
2- Currently in the demo link above, we are connecting to “wss://demos.yjs.dev” in store.ts file. Basically I need to connect to my own server instead of “wss://demos.yjs.dev”.
Is it possible ? If it is then pls share any example. I am very new to Yjs and Backend development.
Note: In the above sandbox link, there is no UI for importing image bcz they have disabled image via a prop. I updated the Tldraw to latest stable version and also enabled images.
Currently I see this blank rectangle instead of image. My guess is Yjs does n’t store images bcz of it’s long base64 strings.
You can start a local YJS websocket server like this:
HOST=localhost PORT=1234 npx y-websocket
And then connect to ws://localhost:1234
I’m not sure how to add image support, but they are probably best stored outside of YJS given that they are in binary and cannot benefit from CRDT merging.
Thanks @raine for your response. Then what should be the best solution for image support ?
And how to start YJS websocket server on production app e.g. if url is web.xyz.com/abc/efg ?
I’m not sure, I’ve never done that before. But Amazon AWS is good for storing images.
The command is the same, but the port will be different. It depends a lot on your hosting platform. I have a DigitalOcean app that opens port 8080 and specifies a start script of HOST=0.0.0.0 PORT=8080 npx y-websocket .
Hey, Steve from tldraw here. I was just browsing while we finish up work on our yjs example for the next tldraw version. If you decide to try the new version (currently in canary releases) then that’s the one to use; though you may get some ideas by reading the code there for v1 too.
