Opened 7 years ago

Last modified 4 years ago

#5190 open feature

Draggable: Performance problems due to css calculations

Reported by: sorcK Owned by:
Priority: minor Milestone: 2.0.0
Component: ui.draggable Version: 1.7.2
Keywords: Cc:
Blocked by: Blocking:


When having 200+ droppables it takes several seconds for a drag to start, and moving the draggable lags.

problem occured on ubuntu and windows vista,7 with firefox 3.5.7 , 3.6 using a highend pc

Change History (5)

comment:1 Changed 6 years ago by adamffyl

I'm having the same problem in my ASP.NET application. It's fine in any other browser but in IE8 it takes 10+ seconds to load the page just because there are so many droppables in my table. Please provide help asap.

comment:2 Changed 5 years ago by ghostd

It seems (according to quick researches with firebug profiler) that a lot of time is spent in getComputedStyle: because the render of nodes is modified in many ways (adding/removins classes and changing CSS position) and _create method call'.csc('position') to check the current node position.

A first (very little) optimization could be replace the following code (from '_create' draggable method)

	(this.options.addClasses && this.element.addClass("ui-draggable"));
	(this.options.disabled && this.element.addClass("ui-draggable-disabled"));


	var uiClasses = this.options.addClasses ? "ui-draggable" : "";
        uiClasses += this.options.disabled ? " ui-draggable-disabled" : "";
	(uiClasses.length && this.element.addClass(uiClasses));

comment:3 Changed 5 years ago by scottgonzalez

  • Type changed from enhancement to feature

comment:4 Changed 4 years ago by scottgonzalez

  • Milestone changed from 1.9.0 to 2.0.0

comment:5 Changed 4 years ago by mikesherov

  • Component changed from ui.droppable to ui.draggable
  • Status changed from new to open
  • Summary changed from UI Droppable , UI Draggable: Performance problems to Draggable: Performance problems due to css calculations

This ticket in core will do lots to help:

Note: See TracTickets for help on using tickets.