Hacker News Reader

Comment by YousefED | Hacker News Reader

fyi, 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 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!

View on HN

YousefED, 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

Thanks 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

I 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.

I 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

Nice, 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.

With 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.

The 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

Can this be used in Svelte or is it only for React?

The 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).

It 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 for more info

blocknote 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.

Reply on news.ycombinator.com