Javascript 这个响应性的表JS代码是否可以提高性能？

这是一张工作票

我只是想知道我是否应该做些什么来提高代码的性能

在此之前，我使用的是dataTables.net的响应插件，我很高兴地说，我的（更简单的）代码运行速度比它快5倍左右。在我的机器上，小提琴的平均速度约为50毫秒，如果使用DT，则为250毫秒

但它能变得更好吗？我远不是一个JS专家，我相信这可以证明。我很高兴放弃jQuery，如果没有它可以做得更好的话

function initResponsiveTables() {
    //does this enhance performance at all?
    'use strict';

    //get an array of <th> elements
    var th = $('th');

    //initialise in top scope
    var priorities = [];

    //iterate over the <th>s, extracting their column priorities
    th.each(function (index) {
        var priority = th[index].getAttribute('data-priority');

        //TODO: this seems very messy, I feel there must be a cleaner way?
        if (priorities[priority] === undefined) {
            priorities[priority] = index;
        } else {
            priorities[priority] += ',' + index;
        }
    });

    //clean up the array so we have consecutive indices
    priorities = priorities.filter(function (x) {
        return x !== undefined && x !== null;
    });

    //initialise all of these outside of the loop
    var sCols = '';
    var aCols = [];
    var aSelectors = [];
    var sSelectors = '';
    var i;

    //while the table is wider than the window, and there's still columns to remove
    while ($('#table').width() > $(window).width() - 40 && priorities.length > 0) {
        //get the lowest priority
        sCols = (priorities.pop() + '');

        //split it, in case we have more than one column on the same priority
        //in this case we prefer to remove them as a group, rather than one at a time
        aCols = sCols.split(',');

        //clear the array from previous iteration
        aSelectors = [];
        for (i = 0; i < aCols.length; i++) {
            //build up the jQuery selectors
            aSelectors.push('td:nth-child(' + aCols[i] + '), th:nth-child(' + aCols[i] + ')');
        }

        //make jQuery selector string
        sSelectors = aSelectors.join(', ');

        //hide relevant columns
        $(sSelectors).css('display', 'none');
    }
}

var start = performance.now();;

initResponsiveTables();

alert(performance.now() - start);

函数initResponsiveTables（）{
//这会提高性能吗？
"严格使用",；
//获取一个元素数组
变量th=$（'th'）；
//在顶部范围内初始化
var优先级=[]；
//迭代s，提取其列优先级
每个（功能（索引）{
var priority=th[index].getAttribute（'data-priority'）；
//托多：这看起来很乱，我觉得一定有更干净的方法？
if（优先级[优先级]==未定义）{
优先级[优先级]=索引；
}否则{
优先级[优先级]+='，'+索引；
}
});
//清理数组，使我们有连续的索引
优先级=优先级。过滤器（函数（x）{
返回x！==undefined&&x！==null；
});
//在循环外部初始化所有这些
var sCols=''；
var aCols=[]；
var-aSelectors=[]；
变量选择器=“”；
var i；
//虽然表比窗口宽，但仍有列需要删除
while（$（'#table'）.width（）>$（window.width（）-40&&priorities.length>0）{
//获得最低优先级
sCols=（priorities.pop（）+“”）；
//拆分它，以防在同一优先级上有多个列
//在这种情况下，我们更愿意将它们作为一个组删除，而不是一次删除一个
aCols=sCols.split（'，'）；
//从上一次迭代中清除数组
A选择器=[]；
对于（i=0；i

---

谢谢

我想你的问题最好放在这个地方。我不知道有这样一个社区存在@Tarekis，谢谢！我可以把它也留在这里吗？或者我需要选择一个还是另一个？我认为最好将您的问题转移到另一个社区并删除它，这样，如果代码审阅社区不响应，您可以在这里重试，但正确使用社区对于保持堆栈交换的有序性至关重要。@Tarekis代码审阅总是有响应。@Mast对问题的响应总是基于问题本身，但我看到您认为大量的代码审阅，OP现在肯定会很高兴地移动它；）我想你的问题最好放在这个地方。我不知道有这样一个社区存在@Tarekis，谢谢！我可以把它也留在这里吗？或者我需要选择一个还是另一个？我认为最好将您的问题转移到另一个社区并删除它，这样，如果代码审阅社区不响应，您可以在这里重试，但正确使用社区对于保持堆栈交换的有序性至关重要。@Tarekis代码审阅总是有响应。@Mast对问题的响应总是基于问题本身，但我看到您认为大量的代码审阅，OP现在肯定会很高兴地移动它；）