From 12e0de21ae4d753eee3950be9b95848a82df6f15 Mon Sep 17 00:00:00 2001
From: ycdtosa <ycdtosa@gmail.com>
Date: Mon, 12 May 2014 11:39:54 +0200
Subject: [PATCH 1/3] changes on updateResults, populate by @cervengoc on #781

use string concatenation instead of DOM manipulation at populate. This
does gives about a 45% speed boost as measured with chrome v35. Code by
@cervengoc on #781
---
 select2.js | 52 ++++++++++++++++++++++++++++++----------------------
 1 file changed, 30 insertions(+), 22 deletions(-)

diff --git a/select2.js b/select2.js
index 580d32ed..de25c8b2 100644
--- a/select2.js
+++ b/select2.js
@@ -919,39 +919,46 @@ the specific language governing permissions and limitations under the Apache Lic
 
                     populate=function(results, container, depth) {
 
-                        var i, l, result, selectable, disabled, compound, node, label, innerContainer, formatted;
+                        var i, l, result, selectable, disabled, compound, node, label, innerContainer, formatted, formattedClass;
 
                         results = opts.sortResults(results, container, query);
 
+                        // collect the created nodes for bulk append
+                        var nodes = [];
                         for (i = 0, l = results.length; i < l; i = i + 1) {
 
                             result=results[i];
-
                             disabled = (result.disabled === true);
                             selectable = (!disabled) && (id(result) !== undefined);
-
                             compound=result.children && result.children.length > 0;
 
-                            node=$("<li></li>");
-                            node.addClass("select2-results-dept-"+depth);
-                            node.addClass("select2-result");
-                            node.addClass(selectable ? "select2-result-selectable" : "select2-result-unselectable");
-                            if (disabled) { node.addClass("select2-disabled"); }
-                            if (compound) { node.addClass("select2-result-with-children"); }
-                            node.addClass(self.opts.formatResultCssClass(result));
-                            node.attr("role", "presentation");
+                            node ="<li class=\"";
+                            node += "select2-results-dept-" + depth;
+                            node += " select2-result";
+                            node+= selectable ? " select2-result-selectable" : " select2-result-unselectable";
+                            if (disabled)
+                                node += " select2-disabled";
+                            if (compound)
+                                node += " select2-result-with-children";
+                            formattedClass = self.opts.formatResultCssClass(result);
+                            if (formattedClass != undefined)
+                                node += " " + formattedClass;
+                            node += "\" role=\"presentation\">";
 
-                            label=$(document.createElement("div"));
-                            label.addClass("select2-result-label");
-                            label.attr("id", "select2-result-label-" + nextUid());
-                            label.attr("role", "option");
+                            label = "<div class=\"select2-result-label\"";
+                            label += " id=\"select2-result-label-" + nextUid() + "\"";
+                            label += " role=\"option\"";
+                            label += ">";
+                            formatted = opts.formatResult(result, label, query, self.opts.escapeMarkup);
+                            if (formatted !== undefined)
+                                label += formatted;
+                            label += "</div>";
 
-                            formatted=opts.formatResult(result, label, query, self.opts.escapeMarkup);
-                            if (formatted!==undefined) {
-                                label.html(formatted);
-                                node.append(label);
-                            }
+                            node += label;
+                            node += "</li>";
 
+                            // I still used jQuery wrapping for setting "data" below
+                            node = $(node);
 
                             if (compound) {
 
@@ -962,9 +969,10 @@ the specific language governing permissions and limitations under the Apache Lic
                             }
 
                             node.data("select2-data", result);
-                            container.append(node);
+                            nodes.push(node[0]);
                         }
-
+                        // bulk append the created nodes
+                        container.append(nodes);
                         liveRegion.text(opts.formatMatches(results.length));
                     };
 

From c14f45cb6c62e452f3b9bed3b12dea0c19dd849e Mon Sep 17 00:00:00 2001
From: ycdtosa <ycdtosa@gmail.com>
Date: Tue, 13 May 2014 09:54:00 +0200
Subject: [PATCH 2/3] Revert "changes on updateResults, populate by @cervengoc
 on #781"

This reverts commit 12e0de21ae4d753eee3950be9b95848a82df6f15.
---
 select2.js | 52 ++++++++++++++++++++++------------------------------
 1 file changed, 22 insertions(+), 30 deletions(-)

diff --git a/select2.js b/select2.js
index de25c8b2..580d32ed 100644
--- a/select2.js
+++ b/select2.js
@@ -919,46 +919,39 @@ the specific language governing permissions and limitations under the Apache Lic
 
                     populate=function(results, container, depth) {
 
-                        var i, l, result, selectable, disabled, compound, node, label, innerContainer, formatted, formattedClass;
+                        var i, l, result, selectable, disabled, compound, node, label, innerContainer, formatted;
 
                         results = opts.sortResults(results, container, query);
 
-                        // collect the created nodes for bulk append
-                        var nodes = [];
                         for (i = 0, l = results.length; i < l; i = i + 1) {
 
                             result=results[i];
+
                             disabled = (result.disabled === true);
                             selectable = (!disabled) && (id(result) !== undefined);
+
                             compound=result.children && result.children.length > 0;
 
-                            node ="<li class=\"";
-                            node += "select2-results-dept-" + depth;
-                            node += " select2-result";
-                            node+= selectable ? " select2-result-selectable" : " select2-result-unselectable";
-                            if (disabled)
-                                node += " select2-disabled";
-                            if (compound)
-                                node += " select2-result-with-children";
-                            formattedClass = self.opts.formatResultCssClass(result);
-                            if (formattedClass != undefined)
-                                node += " " + formattedClass;
-                            node += "\" role=\"presentation\">";
+                            node=$("<li></li>");
+                            node.addClass("select2-results-dept-"+depth);
+                            node.addClass("select2-result");
+                            node.addClass(selectable ? "select2-result-selectable" : "select2-result-unselectable");
+                            if (disabled) { node.addClass("select2-disabled"); }
+                            if (compound) { node.addClass("select2-result-with-children"); }
+                            node.addClass(self.opts.formatResultCssClass(result));
+                            node.attr("role", "presentation");
 
-                            label = "<div class=\"select2-result-label\"";
-                            label += " id=\"select2-result-label-" + nextUid() + "\"";
-                            label += " role=\"option\"";
-                            label += ">";
-                            formatted = opts.formatResult(result, label, query, self.opts.escapeMarkup);
-                            if (formatted !== undefined)
-                                label += formatted;
-                            label += "</div>";
+                            label=$(document.createElement("div"));
+                            label.addClass("select2-result-label");
+                            label.attr("id", "select2-result-label-" + nextUid());
+                            label.attr("role", "option");
 
-                            node += label;
-                            node += "</li>";
+                            formatted=opts.formatResult(result, label, query, self.opts.escapeMarkup);
+                            if (formatted!==undefined) {
+                                label.html(formatted);
+                                node.append(label);
+                            }
 
-                            // I still used jQuery wrapping for setting "data" below
-                            node = $(node);
 
                             if (compound) {
 
@@ -969,10 +962,9 @@ the specific language governing permissions and limitations under the Apache Lic
                             }
 
                             node.data("select2-data", result);
-                            nodes.push(node[0]);
+                            container.append(node);
                         }
-                        // bulk append the created nodes
-                        container.append(nodes);
+
                         liveRegion.text(opts.formatMatches(results.length));
                     };
 

From 0f8a85b9945055b369d500a6eeb4757f8c5050ff Mon Sep 17 00:00:00 2001
From: ycdtosa <ycdtosa@gmail.com>
Date: Tue, 13 May 2014 12:27:31 +0200
Subject: [PATCH 3/3] update populate at formatResults to use bulk append of
 nodes

this will make a small (25%) improvement on speed.
---
 select2.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/select2.js b/select2.js
index 580d32ed..49abd8a1 100644
--- a/select2.js
+++ b/select2.js
@@ -923,6 +923,8 @@ the specific language governing permissions and limitations under the Apache Lic
 
                         results = opts.sortResults(results, container, query);
 
+                        // collect the created nodes for bulk append
+                        var nodes = [];
                         for (i = 0, l = results.length; i < l; i = i + 1) {
 
                             result=results[i];
@@ -962,9 +964,11 @@ the specific language governing permissions and limitations under the Apache Lic
                             }
 
                             node.data("select2-data", result);
-                            container.append(node);
+                            nodes.push(node[0]);
                         }
 
+                        // bulk append the created nodes
+                        container.append(nodes);
                         liveRegion.text(opts.formatMatches(results.length));
                     };