Optimized HTML/JS/CSS Dashboard for iPad with DnD

Question

I'm currently trying to create a usable HTML/CSS/JS based dashboard that behaves reasonably well on an iPad. The Dashboard will contain several widgets with mainly charts. I started using gridster and it works well on an iPad (the only one i found, the rest are either based on gridster[2], don't support an iPad or to overweight / slow [3]).

However, when the widget content is more complex (e.g. a chart), everything behaves really slow. I'm currently trying to reconfigure gridster to not render the content when dragging, or for another widget solution that behaves fluently on the iPad, even when more complex content is dragged. Any suggestions?

A related point: Would CSS3 transitions a way to optimize this, because as I understand them, they are hardware supported and don't rely on JavaScript for rendering? Or are they not suited for small, real-time movements that are calculated on the fly.

Answer 1

We didn't find anything that worked better than gridster and was faster. So we made gridster "faster" by basically hiding the widget content while dragging, this performs better on iPad and older devices.