The basic test conclusions are as follows:
Faster string addition:
Many people mistakenly think that the array push method concatenate the string will be faster than + =, to know that this is only the IE6-8 of the browser (according to my test, IE7 is actually better performance ).
The actual test shows that the use of ++ = in modern browsers is faster than the array push method, and the use of ++ = in v8 engines is 4.7 times faster than that in array splicing.
Therefore, the best optimization strategy is to use two different String concatenation methods based on the JavaScript engine features.
Test code:
[Html]
<! Doctype html public "-// W3C // dtd html 4.0 Transitional // EN">
<HTML>
<HEAD>
<TITLE> test the differences between different browser engines in the String concatenation method </TITLE>
<Meta name = "Generator" CONTENT = "EditPlus">
<Meta name = "Author" CONTENT = "">
<Meta name = "Keywords" CONTENT = "">
<Meta name = "Description" CONTENT = "">
</HEAD>
<BODY>
<Div id = 'result'> </div>
<Script language = "JavaScript">
<! --
/*
The test conclusion is as follows:
Faster string Addition
Many people mistakenly think that the array push method concatenate the string will be faster than + =, to know that this is only the IE6-8 of the browser.
The actual test shows that the use of ++ = in modern browsers is faster than the array push method, and the use of ++ = in v8 engines is 4.7 times faster than that in array splicing.
Therefore, rtTemplate uses two different String concatenation methods based on the JavaScript engine features.
*/
Function show_result (key, val ){
Var oDiv = document. getElementById ('result ');
Var oChildDiv = document. createElement ('div ');
OChildDiv. innerHTML = key + '=' + val;
ODiv. appendChild (oChildDiv)
};
Var total_loop = 20000; // defines the number of times the String concatenation operation is executed.
Var append_str = 'a'; // The concatenation character. For test convenience, only one character is concatenated here.
Var total_times = 100; // Number of test cases executed
// Execute the total_times string + = operation, output the time each time, and calculate the average time consumption
Var s = '', beg = 0, end = 0, dif = 0;
Var plus_total_time = 0; // total time for total_times execution
For (var tt = 0; tt <total_times; tt ++ ){
// Initialize each time
S = '';
Beg = new Date ();
For (var loop = 0; loop <total_loop; loop ++ ){
S + = append_str;
}
End = new Date ();
Dif = end-beg;
Plus_total_time + = dif; // cumulative time, used to calculate the average value
// Output each time
Show_result ('nth '+ (tt + 1) + 'time consumed', dif );
}
// Output bottleneck time
Show_result ('+ = average operation time', plus_total_time/total_times );
// Execute the total_times String Array push operation, output the time each time, and calculate the average time consumption
S = '', beg = 0, end = 0, dif = 0;
Plus_total_time = 0; // total time for total_times execution
Var arr;
For (var tt = 0; tt <total_times; tt ++ ){
// Initialize each time
S = '', arr = [];
Beg = new Date ();
For (var loop = 0; loop <total_loop; loop ++ ){
Arr. push (append_str );
}
S = arr. join ();
End = new Date ();
Dif = end-beg;
Plus_total_time + = dif; // cumulative time, used to calculate the average value
// Output each time
Show_result ('nth '+ (tt + 1) + 'time consumed', dif );
}
// Output bottleneck time
Show_result ('average time spent by push operations ', plus_total_time/total_times );
// -->
</SCRIPT>
</BODY>
</HTML>
Test data:
Chrome:
When the join operation is performed for 20000 times: the push performance ratio is + = slightly better: push time consumption: 0.37, + = time consumption: 0.51
When splicing is performed for 200000 times: + = has a much better performance than push: push time consumption: 37.03, + = time consumption: 4.49
FireFox:
When splicing is performed for 200000 times: + = has better performance than push: push time consumed: 9.92, + = Time consumed: 6.47
When splicing is performed for 20000 times: + = has better performance than push: push time consumed: 0.77, + = Time consumed: 0.54
FF is relatively stable.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
