DFlex – Alternative to HTML5 Drag and Drop
DFlex is the first and the only library that allows you to drag and drop DOM elements without reconstructing the DOM. It implements transformations to intract with DOM elements even when migrating between containers.
It's work in progress and I'd love to get your feedback :)
Trending on Indie Hackers
How does it compare to react-dnd?
Can it be used in an iframe?
I get this question a lot and basically comparing DFlex to any other library is more like comparing React to JQuery.
DFlex has a totally different approach while all the exciting Drag and Drop libraries follow the exact same approach. Modify the DOM every time the user interacts with any element.
The traditional implementation kills the benefit of DOM manipulation and totally ignores any type of reconciliation introduced by all modern frameworks.
All the react/vue/svelte dnd libraries modify the DOM regardless of the framework because until DFlex if you want to drag elements in the list you change its root.
So the user clicks, you change the DOM. Every interaction means a direct change to the DOM and in most cases cloning the targeted element (that's why the showcases mostly div with text). DFlex doesn't change DOM at all or change the order of the elements instead it transforms the position from one point to another with a tone of other enhancements it has a mechanism that enables interactive DOM.
Because of transformation you can sense the movement and control it fully. So you get insanely high performance and a rich user experience.
Can it be used in an iframe?
I can't see why not but didn't test it with an iframe. If there are any issues I'll be happy to deal with them.