Use strings accumulator-style?

K

Kamjah Kogumah

A Dev Opera article [1] suggest using code 2 instead of code 1 in
performance-critical functions.

code 1:
a += 'x' + 'y';

code 2:
a += 'x';
a += 'y';

But I thought string concatenation takes longer time when involved
strings are long.
code 1 does two concatenations : 'x'+'y' and a+'xy'
code 2 does : a+'x' and a+'y'.
If a is long enough, code 2 should take twice much time as code 1
because it takes small time to do 'x'+'y' and it takes long to do
a+something. Am I missing something?

[1] Dev Opera - Efficient JavaScript - Use strings accumulator-style
http://dev.opera.com/articles/view/efficient-javascript/?page=2#stringaccumulator
 
E

Erwin Moller

Kamjah said:
A Dev Opera article [1] suggest using code 2 instead of code 1 in
performance-critical functions.

code 1:
a += 'x' + 'y';

code 2:
a += 'x';
a += 'y';

But I thought string concatenation takes longer time when involved
strings are long.
code 1 does two concatenations : 'x'+'y' and a+'xy'
code 2 does : a+'x' and a+'y'.
If a is long enough, code 2 should take twice much time as code 1
because it takes small time to do 'x'+'y' and it takes long to do
a+something. Am I missing something?

[1] Dev Opera - Efficient JavaScript - Use strings accumulator-style
http://dev.opera.com/articles/view/efficient-javascript/?page=2#stringaccumulator

Why don't you do some profiling with long strings and just check the time
needed to perform the operations? You can see for yourself if it is right
what is claimed in the article.

But I agree with you it doesn't make a lot of sense.
Maybe some mechanism under the hood is optimized for the a += 'x' approach.
(Guessing now)
maybe 'x' + 'y' will be evaluated first into a new value, and then added to
a, while the construct a += 'x' will simply add to the string without need
to make a temporarely variable holding 'x'+'y'.

In such rare cases I care about speed I alway profile in the poor man's way:
timestamping.

just my 2 cent

Regards,
Erwin Moller
 
K

Kamjah Kogumah

Erwin said:
Kamjah said:
A Dev Opera article [1] suggest using code 2 instead of code 1 in
performance-critical functions.

code 1:
a += 'x' + 'y';

code 2:
a += 'x';
a += 'y';

But I thought string concatenation takes longer time when involved
strings are long.
code 1 does two concatenations : 'x'+'y' and a+'xy'
code 2 does : a+'x' and a+'y'.
If a is long enough, code 2 should take twice much time as code 1
because it takes small time to do 'x'+'y' and it takes long to do
a+something. Am I missing something?

[1] Dev Opera - Efficient JavaScript - Use strings accumulator-style
http://dev.opera.com/articles/view/efficient-javascript/?page=2#stringaccumulator

Why don't you do some profiling with long strings and just check the time
needed to perform the operations? You can see for yourself if it is right
what is claimed in the article.

But I agree with you it doesn't make a lot of sense.
Maybe some mechanism under the hood is optimized for the a += 'x' approach.
(Guessing now)
maybe 'x' + 'y' will be evaluated first into a new value, and then added to
a, while the construct a += 'x' will simply add to the string without need
to make a temporarely variable holding 'x'+'y'.

In such rare cases I care about speed I alway profile in the poor man's way:
timestamping.

According to my profiling,
code 2 takes twice much time as code 1 in Firefox 2.0.
code 2 takes about 0.8 of time as code 1 in Opera 9. code 2 is faster
in Opera.
both codes takes about same time in Internet Explorer 6


Tested with online Tryit Editor. Test source:

<html><body><script type="text/javascript">

times = {}; //global.
function tick(id){
id = id || 'def';
times[id] = (new Date()).getTime();
}
function tack(id){
id = id || 'def';
times[id] = (new Date()).getTime() - times[id];
return times[id];
}
function measure(f,message){
tick();
f();
var t = tack();
document.write(message+' : '+t+'<br>');
}
m = 10000;
n = 100; //global
measure( function(){
var a ='';
for(var j=0;j<m;j++){
a = '';
for(var i=0;i<n;i++){
a += 'x' + 'y';
}
}
},'temp var');
measure( function(){
var a ='';
for(var j=0;j<m;j++){
a = '';
for(var i=0;i<n;i++){
a += 'x';
a += 'y';
}
}
},'two concat');

</script></body></html>


test result:

firefox 2.0
first try
temp var : 4157
two concat : 9359
second try
temp var : 4094
two concat : 8765

opera 9
first try
temp var : 3266
two concat : 2625
second try
temp var : 3328
two concat : 2703

ie 6 (with modified setting m = 5000)
first try
temp var : 3266
two concat : 3297
second try
temp var : 3265
two concat : 3297
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,768
Messages
2,569,575
Members
45,053
Latest member
billing-software

Latest Threads

Top