Best way to prevent column widths from changing after sort

I'm using the Responsive extension so my column resize and play nicely at different resolutions. One of the usability issues I'm running into is the column width can change when I click a column to change the sort order.

I know I can wrap the table in the "nowrap" class, but that's not the behavior we're after.

What I really want is for columns to have a minimum width and for text that doesn't fit in the column to have a text-overflow with an ellipsis.

I've been able to accomplish what I want by doing the following:

1. Adding an inner div (.datatable-column-width) to each cell w/a the text overflow rules (i.e. overflow: hidden; text-overflow: ellipsis; white-space: nowrap;)
2. Setting an min-width to each .datatable-column-width element
3. Attaching a column-sizing.dt event which: (a) sets the width of each header to it's current width (this shouldn't be necessary, but seems to be required) and (b) updating the max-width for each .datatable-column-width element to match it's heading width (using instance.column(idx).nodes()).

This works, but it's pretty expensive because it has to loop through every cell in the table each time the resize event fires.

I could speed things up by building dynamic classes and then updating those styles instead of updating the property on each cell directly. That should speed things up quite a bit.

However, before I do that, does anyone else have a better solution?

(NOTE: I'm also doing something similar so I can create columns with a fixed width. I have some columns where I want to set a specific width for the column and setting the width, min-width and max-width on the cell data seems to be the only way to reliable do this.)