js中性能更好的在数组头部插入大量数据

今天闲着无聊测试了一下js数组splice方法的性能发现：当数组的长度大于100000的时候整个页面会出于比较长的卡死状态，故试着写了个性能更好的方法来实现批量在数组头部插入数据：

let splice = function (arr) {
    let cache = arr || []
    return {
        add: function (value) {
            cache.push(value)
        },
        get: function () {
            return cache.reverse()
        }
    }
}

和ramda、原生splice的性能比较：

测试代码如下：

<script src="https://cdn.bootcss.com/ramda/0.25.0/ramda.min.js"></script>
<script>
let splice = function (arr) {
    let cache = arr || []
    return {
        add: function (value) {
            cache.push(value)
        },
        get: function () {
            return cache.reverse()
        }
    }
}
    
let startTime = null;
let useTime = null;
var arr = [];
var len = 100000;
let arrT = splice(arr)
startTime = performance.now()
for(let i = 0; i < len; i++) {
    arrT.add(i)
}
arr = arrT.get()
useTime = performance.now() - startTime
console.log(arr)
console.log(useTime)


arr = []
startTime = performance.now()
for(let i = 0; i < len; i++) {
    arr = R.prepend(i, arr)
}
useTime = performance.now() - startTime
console.log(arr)
console.log(useTime)

arr = []
startTime = performance.now()
for(let i = 0; i < len; i++) {
    arr.splice(0, 0, i)
}
useTime = performance.now() - startTime
console.log(arr)
console.log(useTime)
</script>

测试中发现当数据量小于三百的时候，使用splice性能更好；小数据量的时候ramda的prepend方法性能也是最差的。