Suggestion: add nodeSize and offset values to the DOM

1

It would be nice to have a reference in the DOM node of the EditorState.

The use case is for operations that can start in the DOM instead of the EditorView.

Use case example: Drag and drop performed in the DOM by a library like dragula. Drag and drop in ProseMirror seems to be very expensive and becomes very sluggish. It’s a lot more performant and simple to do it in the DOM instead. The problem is to track back the DOM changes to the EditorState.

If there were properties or a data attributes in the DOM node with these references the sync between the DOM and the EditorState would be simpler.

2

External code directly messing with the DOM isn’t going to be supported, as it’d make any changes to the way the editor manages the DOM breaking API changes.

I haven’t seen this, but an example would be welcome. I don’t really expect a 3rd party implementation of drag and drop to be able to be much faster than what ProseMirror itself is doing.

3

This is ProseMirror with the DropCursor Plugin: Demo Video | Dino Demo Video

This is using the Dragula Library: Demo Video

The drag and drop in ProseMirror is so sluggish that it takes a while after dragging for the changes to catchup. The DropCursor decoration element also takes a while to catchup with the mouse cursor.

DropCursor also seems to have a bug where it duplicates the node being dragged.

4

Can you reproduce this on the demos on http://prosemirror.net? If not, can you try to reduce your setup to the minimal code that reproduces the issue?

5

This video is from the dino demos: Dino Demo Video

I’m using Chrome. Tried different browsers and it seems that it works best with Firefox, Edge is fairly good also. Safari has the same problem as Chrome.

Firefox Video Edge Video

You can easily reproduce it with this demo: https://prosemirror.net/demo/dino.html

There are a few bugs that seem to be consistent across browsers:

  • duplication of the node being dragged
  • flickers the cursor rapidly when the cursor is in between nodes
6

Dragging in the dino demo shows zero lag for me. Do you have any Browser addons that might be interfering?

What do you mean by ‘duplicationg of the node being dragged’?

The flickering is a known problem. Feel free to open an issue if you want to track it.

7

I ran it again in an incognito window with no extensions and the problem persists, both in Chrome and Safari. In Edge it runs fairly better, but still not as good as Firefox.

Regarding the duplication of nodes you can see it in the Firefox video, but here’s a screenshot: