Strings Concatenation With Separator: join, +, concat (v4)

Revision 4 of this benchmark created on

Setup

function testAddForOf(...args) {
    const [firstString, ...otherStrings] = args
    var string = firstString

    for (const item of otherStrings) {
        string += ' '+ item
    }

    return string
}

function testAddForEach(...args) {
    const [firstString, ...otherStrings] = args
    var string = firstString

    otherStrings.forEach(item => {
        string += ' '+ item
    })

    return string
}

function testAddForLoop(...args) {
    const [firstString, ...otherStrings] = args
    var string = firstString

    for (let idx = 0, size = otherStrings.length; idx < size; ++idx) {
        string += ' '+ otherStrings[idx]
    }

    return string
}

function testJoinPush(...args) {
    const string = []

    for (const item of args) {
        string.push(item)
    }

    return string.join(' ')
}

function testJoinIndex(...args) {
    const string = []

    for (let idx = 0, size = args.length; idx < size; ++idx) {
        string[idx] = args[idx]
    }

    return string.join(' ')
}

const concat = String.prototype.concat.bind(String.prototype)

function testConcat(...args) {
    const [firstString, ...otherStrings] = args
    var string = firstString

    for (const item of otherStrings) {
        string = concat(string, ' '+ item)
    }

    return string
}

const data = {
    data1() {
        return [
            `Component1-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
            `Component2-${Date.now()}`,
        ]
    },
    data2() {
        return [
            `Component1-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
            `Component2-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
        ]
    },
    data3() {
        return [
            `Component1-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
            `Component2-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
            `Component3-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
            `Component4-${Date.now()} std-flex std-flex-column std-flex-align-center std-overflow-hidden`,
        ]
    },
}

Test runner

Ready to run.

Testing in
TestOps/sec
Add for-of
testAddForOf(...data.data1())
testAddForOf(...data.data2())
testAddForOf(...data.data3())
ready
Add for-each
testAddForEach(...data.data1())
testAddForEach(...data.data2())
testAddForEach(...data.data3())
ready
Add for-loop
testAddForLoop(...data.data1())
testAddForLoop(...data.data2())
testAddForLoop(...data.data3())
ready
Concat
testConcat(...data.data1())
testConcat(...data.data2())
testConcat(...data.data3())
ready
Join push
testJoinPush(...data.data1())
testJoinPush(...data.data2())
testJoinPush(...data.data3())
ready
Join index
testJoinIndex(...data.data1())
testJoinIndex(...data.data2())
testJoinIndex(...data.data3())
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.