1
0
mirror of synced 2024-11-26 06:46:04 +03:00

Improve data array speeds

This improves the speeds of creating the `<option>` tags for array
data. By creating the HTML ahead of time and putting it into an
`<option>` element before passing it to jQuery, it cuts down on the
time it takes for jQuery to process the HTML string and convert it
into DOM elements. This proved to be incredibly slow.

This also changes the `item` function to return early when the
data exists. The `$e.data` call has also been switched to a
`$.data` call, which doesn't need to check the DOM to see if the
data attributes already exist. This cuts down on a bit of wasted
time, as the `data` key should never be present in the DOM, and it
should be ignored if it is.
This commit is contained in:
Kevin Brown 2014-11-07 11:13:53 -05:00
parent 56dbbf8cdb
commit 05ddbec1a7
8 changed files with 334 additions and 228 deletions

View File

@ -1098,30 +1098,41 @@ define('select2/data/select',[
};
SelectAdapter.prototype.option = function (data) {
var $option = $('<option></option>');
var option = document.createElement('option');
$option.text(data.text);
$option.val(data.id);
$option.prop('disabled', data.disabled || false);
$option.prop('selected', data.selected || false);
option.value = data.id;
// Get any automatically generated data values
var detectedData = this.item($option);
if (data.disabled) {
option.disabled = true;
}
// Merge it with the already present data
var combinedData = $.extend({}, data, detectedData);
if (data.selected) {
option.selected = true;
}
option.innerText = data.text;
var $option = $(option);
var normalizedData = this._normalizeItem(data);
// Override the option's data with the combined data
$option.data('data', combinedData);
$.data($option, normalizedData);
return $option;
};
SelectAdapter.prototype.item = function ($option) {
var data = $option.data('data');
var data = {};
if ($.hasData($option)) {
data = $option.data('data');
if (data != null) {
return data;
}
}
// If the data has already be generated, use it
if (data == null) {
if ($option.is('option')) {
data = {
id: $option.val(),
@ -1148,18 +1159,26 @@ define('select2/data/select',[
data.children = children;
}
if (data.id && this.container != null) {
data._resultId = this.generateResultId(this.container, data);
}
data.selected = $option.prop('selected');
data = this._normalizeItem(data);
$option.data('data', data);
}
return data;
};
SelectAdapter.prototype._normalizeItem = function (item) {
var defaults = {
selected: false,
disabled: false
};
if (item._resultId == null && item.id && this.container != null) {
item._resultId = this.generateResultId(this.container, item);
}
return $.extend({}, defaults, item);
};
SelectAdapter.prototype.matches = function (params, data) {
var matcher = this.options.get('matcher');

View File

@ -1098,30 +1098,41 @@ define('select2/data/select',[
};
SelectAdapter.prototype.option = function (data) {
var $option = $('<option></option>');
var option = document.createElement('option');
$option.text(data.text);
$option.val(data.id);
$option.prop('disabled', data.disabled || false);
$option.prop('selected', data.selected || false);
option.value = data.id;
// Get any automatically generated data values
var detectedData = this.item($option);
if (data.disabled) {
option.disabled = true;
}
// Merge it with the already present data
var combinedData = $.extend({}, data, detectedData);
if (data.selected) {
option.selected = true;
}
option.innerText = data.text;
var $option = $(option);
var normalizedData = this._normalizeItem(data);
// Override the option's data with the combined data
$option.data('data', combinedData);
$.data($option, normalizedData);
return $option;
};
SelectAdapter.prototype.item = function ($option) {
var data = $option.data('data');
var data = {};
if ($.hasData($option)) {
data = $option.data('data');
if (data != null) {
return data;
}
}
// If the data has already be generated, use it
if (data == null) {
if ($option.is('option')) {
data = {
id: $option.val(),
@ -1148,18 +1159,26 @@ define('select2/data/select',[
data.children = children;
}
if (data.id && this.container != null) {
data._resultId = this.generateResultId(this.container, data);
}
data.selected = $option.prop('selected');
data = this._normalizeItem(data);
$option.data('data', data);
}
return data;
};
SelectAdapter.prototype._normalizeItem = function (item) {
var defaults = {
selected: false,
disabled: false
};
if (item._resultId == null && item.id && this.container != null) {
item._resultId = this.generateResultId(this.container, item);
}
return $.extend({}, defaults, item);
};
SelectAdapter.prototype.matches = function (params, data) {
var matcher = this.options.get('matcher');

View File

@ -10633,30 +10633,41 @@ define('select2/data/select',[
};
SelectAdapter.prototype.option = function (data) {
var $option = $('<option></option>');
var option = document.createElement('option');
$option.text(data.text);
$option.val(data.id);
$option.prop('disabled', data.disabled || false);
$option.prop('selected', data.selected || false);
option.value = data.id;
// Get any automatically generated data values
var detectedData = this.item($option);
if (data.disabled) {
option.disabled = true;
}
// Merge it with the already present data
var combinedData = $.extend({}, data, detectedData);
if (data.selected) {
option.selected = true;
}
option.innerText = data.text;
var $option = $(option);
var normalizedData = this._normalizeItem(data);
// Override the option's data with the combined data
$option.data('data', combinedData);
$.data($option, normalizedData);
return $option;
};
SelectAdapter.prototype.item = function ($option) {
var data = $option.data('data');
var data = {};
if ($.hasData($option)) {
data = $option.data('data');
if (data != null) {
return data;
}
}
// If the data has already be generated, use it
if (data == null) {
if ($option.is('option')) {
data = {
id: $option.val(),
@ -10683,18 +10694,26 @@ define('select2/data/select',[
data.children = children;
}
if (data.id && this.container != null) {
data._resultId = this.generateResultId(this.container, data);
}
data.selected = $option.prop('selected');
data = this._normalizeItem(data);
$option.data('data', data);
}
return data;
};
SelectAdapter.prototype._normalizeItem = function (item) {
var defaults = {
selected: false,
disabled: false
};
if (item._resultId == null && item.id && this.container != null) {
item._resultId = this.generateResultId(this.container, item);
}
return $.extend({}, defaults, item);
};
SelectAdapter.prototype.matches = function (params, data) {
var matcher = this.options.get('matcher');

File diff suppressed because one or more lines are too long

57
dist/js/select2.js vendored
View File

@ -1526,30 +1526,41 @@ define('select2/data/select',[
};
SelectAdapter.prototype.option = function (data) {
var $option = $('<option></option>');
var option = document.createElement('option');
$option.text(data.text);
$option.val(data.id);
$option.prop('disabled', data.disabled || false);
$option.prop('selected', data.selected || false);
option.value = data.id;
// Get any automatically generated data values
var detectedData = this.item($option);
if (data.disabled) {
option.disabled = true;
}
// Merge it with the already present data
var combinedData = $.extend({}, data, detectedData);
if (data.selected) {
option.selected = true;
}
option.innerText = data.text;
var $option = $(option);
var normalizedData = this._normalizeItem(data);
// Override the option's data with the combined data
$option.data('data', combinedData);
$.data($option, normalizedData);
return $option;
};
SelectAdapter.prototype.item = function ($option) {
var data = $option.data('data');
var data = {};
if ($.hasData($option)) {
data = $option.data('data');
if (data != null) {
return data;
}
}
// If the data has already be generated, use it
if (data == null) {
if ($option.is('option')) {
data = {
id: $option.val(),
@ -1576,18 +1587,26 @@ define('select2/data/select',[
data.children = children;
}
if (data.id && this.container != null) {
data._resultId = this.generateResultId(this.container, data);
}
data.selected = $option.prop('selected');
data = this._normalizeItem(data);
$option.data('data', data);
}
return data;
};
SelectAdapter.prototype._normalizeItem = function (item) {
var defaults = {
selected: false,
disabled: false
};
if (item._resultId == null && item.id && this.container != null) {
item._resultId = this.generateResultId(this.container, item);
}
return $.extend({}, defaults, item);
};
SelectAdapter.prototype.matches = function (params, data) {
var matcher = this.options.get('matcher');

File diff suppressed because one or more lines are too long

View File

@ -121,30 +121,41 @@ define([
};
SelectAdapter.prototype.option = function (data) {
var $option = $('<option></option>');
var option = document.createElement('option');
$option.text(data.text);
$option.val(data.id);
$option.prop('disabled', data.disabled || false);
$option.prop('selected', data.selected || false);
option.value = data.id;
// Get any automatically generated data values
var detectedData = this.item($option);
if (data.disabled) {
option.disabled = true;
}
// Merge it with the already present data
var combinedData = $.extend({}, data, detectedData);
if (data.selected) {
option.selected = true;
}
option.innerText = data.text;
var $option = $(option);
var normalizedData = this._normalizeItem(data);
// Override the option's data with the combined data
$option.data('data', combinedData);
$.data($option, normalizedData);
return $option;
};
SelectAdapter.prototype.item = function ($option) {
var data = $option.data('data');
var data = {};
if ($.hasData($option)) {
data = $option.data('data');
if (data != null) {
return data;
}
}
// If the data has already be generated, use it
if (data == null) {
if ($option.is('option')) {
data = {
id: $option.val(),
@ -171,18 +182,26 @@ define([
data.children = children;
}
if (data.id && this.container != null) {
data._resultId = this.generateResultId(this.container, data);
}
data.selected = $option.prop('selected');
data = this._normalizeItem(data);
$option.data('data', data);
}
return data;
};
SelectAdapter.prototype._normalizeItem = function (item) {
var defaults = {
selected: false,
disabled: false
};
if (item._resultId == null && item.id && this.container != null) {
item._resultId = this.generateResultId(this.container, item);
}
return $.extend({}, defaults, item);
};
SelectAdapter.prototype.matches = function (params, data) {
var matcher = this.options.get('matcher');

View File

@ -238,13 +238,24 @@ test('empty optgroups are still shown when queried', function (assert) {
var data = new SelectData($select, options);
data.query({}, function (data) {
assert.deepEqual(
data[1],
{
text: 'Empty',
children: []
},
assert.equal(
data.length,
2,
'The empty optgroup element should still be returned when queried'
);
var item = data[1];
assert.equal(
item.text,
'Empty',
'The text of the empty optgroup should match the label'
);
assert.equal(
item.children.length,
0,
'There should be no children in the empty opgroup'
);
});
});