I am implementing an UI list of items. It supports ordering by sort functions and custom drag and drop ordering.
It will be used for displaying hundreds of items.
I am looking for the “best” way to implement the ordering.
Sorting is always done on data model in memory and is then projected onto the UI.
First solution I know about is just reorder the DOM elements. Simple, but it feels like a little too resource heavy…
…in comparison with flexbox and css order. That is the second solution I have in mind. Assign order with increasing values and let css do its magic… hopefully with less resources used.
The problem with css order is that if I remove or add list items, it does not reindex (the order value) automatically, so there is more maintenance to keep the system working as opposed to using DOM element order.
Do you see any (dis)advantages with using either of those?
Do you agree that using css order is (significantly) faster/less expensive?
Any other options to order elements?