react-beautiful-dnd: where to from here?

The Nugget

The creator of react-beautiful-dnd, Alex Reardon, is sunsetting the library in favor of the new pragmatic-ui/react-dragndrop library which offers better performance and flexibility. Users are recommended to either manually migrate to pragmatic-ui/react-dragndrop or use an automated migration tool, with caveats for each approach.

Make it stick

🔀 Manual migration yields the best user experience, accessibility, and performance.
⚡ Using the automated tool loses ~1/3 of the performance benefits.
🛣️ The automated tool is a good stepping stone for rapid migration.
🧠 Manually migrating takes 1-2 weeks per production UI.

The react-beautiful-dnd library is being sunsetted in favor of the new pragmatic-ui/react-dragndrop project.
pragmatic-ui/react-dragndrop is a low-level, performance-focused drag and drop framework that enables any drag and drop experience across tech stacks.
Users have a few migration options available.

Users can continue using react-beautiful-dnd for now.
However, only security fixes will be provided going forward.
The project will likely be sunset completely at some point, though no timeline is confirmed yet.

There are forks of react-beautiful-dnd that users could explore migrating to.
The author hasn't personally used any forks but has heard good things about some.

Since react-beautiful-dnd's creation, other great drag and drop libraries have emerged that build upon its foundations.
Users could explore migrating to one of those libraries.

The recommended approach is to manually migrate from react-beautiful-dnd to pragmatic-ui/react-dragndrop.
This yields the best user experience, accessibility, and performance outcomes.
For complex UIs, manual migration can take 1-2 weeks per production experience.

An optional package exposes the same React API as react-beautiful-dnd but is powered by pragmatic-ui/react-dragndrop under the hood.
Users can change import paths and retain some compatibility, but the experience will differ from react-beautiful-dnd.
The automated tool loses about 1/3 of the performance benefits compared to a manual migration.
It pulls in motion/js for styling, which may be undesirable for some users.
The automated tool can serve as a stepping stone for rapid initial migration.

"Rather than continuing to invest into react beautiful dndd, we have gone in a different direction and built a new library called pragmatic Dragon drop."
"Nobody loves doing manual migrations however doing it like that will yield the best user experience, best accessibility, and best performance outcomes."
"Dean's done an enormous amount of work to help ensure that this is a safe Target to migrate to."
"You could always use it as a bit of a stepping stone as well."

This summary contains AI-generated information and may have important inaccuracies or omissions.