Archive | jQuery RSS feed for this section

Jquery Dialog slow to open

11 Sep

Here is a good way to speed up jQuery dialogs. This happens when there is a lot of data/html inside the dialog:

http://johnculviner.com/a-jquery-ui-dialog-open-performance-issue-and-how-to-fix-it/

This reduced load time from about 4000ms to about 1100ms.

To summarize (in case the above page changes), you detach the container’s children before you open it, then you re-attach once it is open:

var $dialogContainer = $('#contrib-dialog');
var $detachedChildren = $dialogContainer.children().detach();
$('#contrib-dialog').dialog({
  modal: 1,
  autoOpen: 0,
  height: 'auto',
  width: 985,
  title: "Yup",
 open: function () {
   $detachedChildren.appendTo($dialogContainer);
  }
}).dialog('open');
Advertisements