Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
    username$ npm i y-websocket
    npm WARN y-websockets-client@8.0.16 requires a peer of yjs@^11.0.0 || ^12.0.0 but none is installed. You must install peer dependencies yourself.
    npm WARN client@1.0.0 No description
    npm WARN client@1.0.0 No repository field.
    npm ERR! path /Users/username/Desktop/Projects/YJS/react-yjs-test/node_modules/y-websocket/bin/server.js
    npm ERR! code ENOENT
    npm ERR! errno -2
    npm ERR! syscall chmod
    npm ERR! enoent ENOENT: no such file or directory, chmod '/Users/username/Desktop/Projects/YJS/react-yjs-test/node_modules/y-websocket/bin/server.js'
    npm ERR! enoent This is related to npm not being able to find a file.
    npm ERR! enoent
    @dmonad Hey Kevin, thanks for the great work on Yjs, it's a really cool project. I've got a question: What's the recommended way to achieve persistent storage with Yjs 13? I'm trying to add persistent storage to y-prosemirror, and y-leveldb is not working (getting the same error as @kevmegforest_gitlab ).
    Kevin Forest
    @timweiland I created my own persistence with a y-leveldb.js file. You can take a look there. https://pastebin.com/5SuefhUC . I don't know if it's the right solution and if I will be able to update the y-websocket version with new yjs version once it's updated. (is the encodeStateAsUpdate method final? @dmonad )
    I slightly modified the old version of level db persistence lib in order to get it work with new yjs. Probably it should perform better than the lib proposed by @kevmegforest_gitlab because it doesn't write the whole document on every update, but only the update itself. Here you can get it https://gist.github.com/calibr/c8764d796db270c7c60460f254451580
    @rafeautie it's trying to grab the package y-websockets-client which is different. Try the command npm i y-websocket@next
    Thanks for all of your work on Yjs @dmonad! I've got a question on Authentication in v13. Is authentication functional like it was in v12, or is this still on your to-do list?
    Hi! Does anyone know how to find out how many clients there are in a yjs room?
    Using websockets
    Dominik Renzel
    Hey @dmonad, nice to see that yjs is still so active and popular after all those years! What is the preferred way of defining custom types in yjs 12? I assume, docs at https://github.com/y-js/yjs/wiki/Custom-Types are outdated? Is there any reference I could follow to implement an own custom type, nesting other custom types?
    Duane Johnson
    I wonder if yjs and Braid would make sense together: https://braid.news
      Braid is a proposal for a new version of HTTP that transforms it from
      a state *transfer* protocol into a state *synchronization* protocol.
      Braid puts the power of Operational Transform and CRDTs onto the web,
      improving network performance and robustness, and enabling
      peer-to-peer web applications.
      At the same time, Braid creates an open standard for the dynamic
      internal state of websites.  Programmers can access state uniformly,
      whether local or on another website.  This creates a separation of UI
      from State, and allows any user to edit or choose their own UI for any
      website's state.
    I tried to read the author's paper to understand the principle of Yjs, but it was too difficult for me. Is there any good suggestion or information recommendation, google has nothing to gain 💔
    Hi, I have integrated the Yjs library in my React Application, but can anyone help me out how can i get the data from the Quill and i want to save that data into my database Sql
    Hi, i have integrated Yjs and quill editor library V13 with y-websockets,but i can't able to get documentation related how to get users connected to same room and disconnection
    Kevin Jahns

    @rafeautie If you get issues like this I propose that you have a look at the versions I use in the demos. https://github.com/y-js/yjs-demos Documentation PRs are very welcome.

    @kevmegforest_gitlab Yes, the encodeStateAsUpdate is final. Everything in the v13 docs can be seen as final unless there is a good reason to change it before the stable release.

    @crazypenguinguy If you look at the y-websocket server implementation you can see that there are comments on where to put the authentication. The yjs-demos repository also gives an example on how you could implement your own server with dedicated authentication. The idea here would be to use cookies. But you could also adapt the implementation to use something else.

    @jylopez The awareness instance gives you the number of clients. Users can even propagate state (like user name, email, user-color, etc). The awareneness feature is supported by y-websocket and will be ported to the other connectors as well (v13 only). Documentation https://github.com/y-js/y-protocols

    @canadaduane I think they are proposing a different algorithm. IMO this should be not part of the HTTP specification, rather it should be implemented over websockets.

    Many of the other questions have been asked in the GitHub issue tracker already.

    Kevin Jahns
    @nmaster Hey Dominik, the docs you mentioned are still correct for v12. But custom types won't be supported anymore in v13. Yjs implements the basic types and you can build your application around it. I know some folks that create a wrapper around Yjs that basically act as custom types. For more information about the new API look here https://github.com/y-js/yjs/blob/master/README.v13.md
    Winston Fassett
    I hacked together a port of the drawing example to v13: https://codesandbox.io/s/yjs-v13-drawing-example-3fouz
    Previously YJS events had type and value properties that would indicate whether it was an insert and what was inserted
    For V13 I cobbled together a couple of functions, getInsertedItems and getDeletedItems.
    @dmonad is there a better way to determine the inserts and deletes that were applied to a type during a transaction?
    Kevin Jahns

    Really cool @WinstonFassett ! I love to see demos here. If you want you can also contribute the demo to yjs-demos repository
    The next release (>=v13.0.0-97) attaches a change object to the event that describes what happened during the transaction. I.e.

    array.observe(event => { 
      event.change.delta // similar to the quill delta format but works on all array-like types
      // e.g. [{retain: 4}, {delete: 3}, {insert: [1,2,3]}]
      event.change.added // Set of added items
      event.change.deleted // Set of deleted items
    map.observe(event => {
      event.change.keys // Maps from changed key to { action: 'update'|'delete'|'add', oldValue: any }

    Please note that the API for event changes is not final, hence also not yet in the documentation. But I'd appreciate your feedback

    Also a message of disturbance: I'm going to move all repositories to the github.com/yjs organization. Please let me know if this brakes anything.

    Important: I'm going to move all repositories to the github.com/yjs organization. Please let me know if this breakes anything.

    Kevin Jahns

    Now that we have a new organization-name, I also decided to move this chat-room to https://gitter.im/Yjs/community

    This chat-room moved to https://gitter.im/Yjs/community

    Please don't post anything here anymore.

    hi again! has anyone made an AceEditor binding for version 13? can seem to find it in the docs.
    lol just read the "This chat-room moved" message
    Damian Kaczmarek
    @rafeautie I made an integration by hand which wasn't very hard :)
    @rafeautie for example:
          for (const d of event.delta) {
            if (d.retain) {
              index += d.retain;
            } else if (d.insert) {
              const start = aceDocument.indexToPosition(index, 0);
              aceDocument.insert(start, d.insert);
            } else if (d.delete) {
              const start = aceDocument.indexToPosition(index, 0);
              const end = aceDocument.indexToPosition(index + d.delete, 0);
              const range = new Range(start.row, start.column, end.row, end.column);