需要性能改进

Question

我正在尝试 CasperJS。我正在尝试创建一个网络 scraper 。我需要抓取网站的所有页面并在 5 秒内（每个页面）获取数据。 为此，我将不得不浏览所有类似的页面。转到适当的内容 div 并从那里获取数据。 因此，如果该网站有 1000 个页面。我需要尽快完成整个操作。我无法控制 N/w 延迟、页面大小等参数。我能控制的只是解析机制。所以我希望它尽可能快。如果有很小的改进，那么它将推断为 URL 的数量

我正在尝试解析子元素并创建 CSS 路径。 我需要确保解析不会花费很长时间。 我听说标准的 java 脚本在性能方面比 JQuery 更有效。 因此，我需要输入。

以下 JQuery 代码的标准 JS 等效项是什么，在解析方面性能高效。

function() {    
    var TAG_CSS_PATH = 'div#buttons ul li.tab';
    var selectOptions =  $(TAG_CSS_PATH);
    var results = [],i=0;
    selectOptions.each(function(index,value) {
        index=index+1;
        results.push(TAG_CSS_PATH+':nth-of-type('+index+')');
    });
    return results
}

如果有人可以提供任何其他建议，我将不胜感激。

Answer 1

jQuery 部分是 $selector 和 $each。这些可以替换如下。

function() {    
    var TAG_CSS_PATH = '#buttons ul li.tab',
        selectOptions =  document.querySelectorAll(TAG_CSS_PATH),
        results = [];

    for( var i = 1, ln = selectOptions.length + 1; i < ln; i++ ) {
        results.push(TAG_CSS_PATH+':nth-of-type('+ i +')');
    }

    return results;
}

由于您要存储选择器，因此对我来说似乎仍然非常低效（使用 nth-of-type 是昂贵的选择器）。选择器从右到左读取。

CSS/选择器优化
笔记， div#buttons 似乎是多余的。如果您正确使用 CSS，您将只有 一个 元素与 id='buttons' 完全匹配。因此，通过正确使用 ID，您应该能够删除选择器中的 div。
此外，如果您所有的.tabs 都是li，那么您也可以删除li。如果您所有的li.tabs 都在ul 内，您也可以删除ul。

Answer 2

应该这样做：

function() {    
    var TAG_CSS_PATH = 'div#buttons ul li.tab',
        selectOptions = document.querySelectorAll(TAG_CSS_PATH),
        results = [],
        l = selectOptions.length + 1;
    for(var i = 1; i < l; i++){
        results.push(TAG_CSS_PATH+':nth-of-type('+i+')');
    }
    return results;
}