5 ms·
At the risk of sabotaging stuff I've worked on, it's _astoundingly easy_ to glue together Y.js, prosemirror, and a little bit of express.js to get a distributed
by rtpg 3y ago
At the risk of sabotaging stuff I've worked on, it's _astoundingly easy_ to glue together Y.js, prosemirror, and a little bit of express.js to get a distributed Notion clone with conflict free resolution.
Like I have something that I got working in 3 days with multiple pages, so links between things, and cursor syncing (most of this work is provided by wonderful people with full-featured libraries!). There's some trickiness with how Y.js actually works (in particular map ID conflict resolution meaning you don't want a dictionary of page names to pages but UUIDs and then some sort of manual revision checking....). But you can get that and probably with a bit more work get ~instant search and the like. All with free offline capabilities.
Of course then I stared at this and was like "I like notion because it looks nice" (I personally don't care about the AI stuff or the database stuff), so just went and paid for notion for my family usage.
- JSavageOne 3y agoWould love to see a demo and/or the code if you were open to open-sourcing it! I'm sure there's someone out there who'd be willing to contribute to the styling.
- YousefED 3y agofyi, from my experience it’s still quite a lot of work to build on top of Prosemirror and TipTap directly to do so. So I’ve started working on https://www.blocknotejs.org https://www.blocknotejs.org to make this even easier for developers; its a batteries-included library with Notion style UI elements out of the box. Definitely bullish on this ecosystem including Yjs and local first dev!
- danielvaughn 3y agoI built on the same stack and have a similar opinion. It’s only easy if you’re depending on the webrtc implementation. If you’re coordinating changes across your own server, you gotta put in some work.
- rtpg 3y agoI did not rely on the webrtc implementation. Really you gotta do a lot of "echo server"-style shraing of messages and some sync messages from time to time but Yjs/CRDT stuff works pretty smoothly on this front. But my requirements are pretty loose
- sureglymop 3y agoWith Yjs, how do you persist data in a "normal" database? And yeah, it may he easy for text editing (as pretty much all work is already done) but what if you have some other features where you want to get "live syncing"? It starts out easy but can become harder imo.
- rtpg 3y agoThe core idea is that you are syncing a data structure, for example a map, so you can get a lot done with that (yjs’s presence stuff can be helpful for other live features). In the end I have just been stuffing the data structure directly into postgres “as-is”. I think there are some tricks you can use to shrink some historical data but I think it’s pretty straightforward if you get to a size where the data size matters
- danielvaughn 3y agoNice, yeah from what little I've done with it, I've learned that the difficulty can vary greatly depending on your requirements. For me, I had a pre-existing note-taking app so there were tons of documents stored in html format. So I had this challenge where I had to read them from html, convert them to yjs, then sync the changes back to the DB in html format. It was kinda tough.
- domlebo70 3y agoYousefED, love Blocknote, but I ended up not using it for a new project, just because it's too prescriptive. Which I totally get is a positive for many. I.e they want the UI and controls built in and off the shelf. I would love to just use the Core API (block etc) and get some useful hooks, so I can extend it in my own ways
- YousefED 3y agoThanks for the feedback! It was designed from the philosophy that existing frameworks like PM or even TipTap are too low-level - but I can understand you need more ways to customize UI elements. It's certainly possible, but I think we need to document it better
- rtpg 3y agoblocknote looks very nice! I am unsure why I didn't take this as an option earlier, as I think I looked at it. I will check it out. FWIW I picked up prosemirror because I have experience working with CodeMirror 6, and I trust the general model to be right, if complicated to use. But honestly I might not need the level of complications provided by PM.
- Sateeshm 3y agoCan this be used in Svelte or is it only for React?
- robinson7d 3y agoThe landing page they linked suggests it’s possible, but makes it sound like it might be more work to do so: > BlockNote is built for React and exposes easy-to-use components. However, it is possible to use BlockNote with other frameworks or Vanilla JS (advanced users).
- YousefED 3y agoIt can be used for other frameworks than React, but the React version comes with built-in UI components. See https://www.blocknotejs.org/docs/vanilla-js https://www.blocknotejs.org/docs/vanilla-js for more info
- steventey 3y agoNotion is goat-ed! It's one of the greatest software ever created in our time imho. Y.js sounds amazing – gonna have to look into it! Have been using Liveblocks for real-time data stuff, the DX is a breeze to work with!
- gjpolly 3y agoNotion is just a OneNote alternative.
- deleted 3y ago[deleted]
- mihaic 3y agoWhat's the reason for such high praise for Notion? Asking honestly as I have used it and genuinely don't get the admiration.
- rtpg 3y agoaesthetics are very nice, and the slash menu mechanism + syncing make it nice when working with people. If Google docs looked nice this convo would be different but Google docs doesn’t look nice!
- steventey 3y agoAesthetic aside, I really admire Notion’s extensibility and rich API ecosystem — it’s given rise to website builders like https://super.so https://super.so and https://potion.so https://potion.so, something that I haven’t seen with Google Docs/One Note
- j45 3y agoAny notion replacement needs to be offline first and mobile first.
- eviks 3y agodo you know any like this?
- barryvan 3y agoObsidian plus various plugins would be my recommendation.
- BrandoElFollito 3y agoI use Logseq https://logseq.com/ https://logseq.com/
- j45 3y agoLogseq is closer for me at present, but I like the trick of putting the LogSeq files in an Obsidian folder so obsidian plug-ins can assist too.
- iudqnolq 3y agoI've found reliable persistence on the backend irritating with yjs. Seems like the official path is to fork their example library and edit it. (The example is insufficient because, for example, it will silently eat data if the onchange webhook fails). yrs initially looks tempting but it's unsound at it's core. (The plan is to port the API directly from JS, use unsafe to silence the borrow checker, then gradually fix specific instances of undefined behavior if they cause actual real world issues.[1] I don't this this is an approach that can work. That's a shame because a lot of impressive work has gone into yrs.) [1]: https://github.com/y-crdt/y-crdt/issues/233 https://github.com/y-crdt/y-crdt/issues/233