javascript - 提高使用 jQuery 搜索 JSON 对象的性能

Question

如果这个问题已经在某个地方得到了回答，请原谅我。我搜索过，看来这是一个相当具体的案例。

这是一个 JSON 示例(注意:这是非常精简的 - 这是动态加载的，当前有 126 条记录):

var layout = {
"2":[{"id":"40","attribute_id":"2","option_id":null,"design_attribute_id":"4","design_option_id":"131","width":"10","height":"10",
            "repeat":"0","top":"0","left":"0","bottom":"0","right":"0","use_right":"0","use_bottom":"0","apply_to_options":"0"},
    {"id":"41","attribute_id":"2","option_id":"115","design_attribute_id":"4","design_option_id":"131","width":"2","height":"1",
            "repeat":"0","top":"0","left":"0","bottom":"4","right":"2","use_right":"0","use_bottom":"0","apply_to_options":"0"},
    {"id":"44","attribute_id":"2","option_id":"118","design_attribute_id":"4","design_option_id":"131","width":"10","height":"10",
            "repeat":"0","top":"0","left":"0","bottom":"0","right":"0","use_right":"0","use_bottom":"0","apply_to_options":"0"}],
"5":[{"id":"326","attribute_id":"5","option_id":null,"design_attribute_id":"4","design_option_id":"154","width":"5","height":"5",
            "repeat":"0","top":"0","left":"0","bottom":"0","right":"0","use_right":"0","use_bottom":"0","apply_to_options":"0"}]
};

我需要匹配正确的值组合。这是我当前使用的功能:

function drawOption(attid, optid) {
    var attlayout = layout[attid];
    $.each(attlayout, function(k, v) {
        // d_opt_id and d_opt_id are global scoped variable set elsewhere
        if (v.design_attribute_id == d_att_id
            && v.design_option_id == d_opt_id  
            && v.attribute_id == attid 
            && ((v.apply_to_options == 1 || (v.option_id === optid)))) {
                // Do stuff here
        }
    });
}

问题是我可能会迭代 10-15 个布局(唯一的 attid)，并且任何给定的布局(attid)可能有多达 50 种可能性，这意味着这个循环正在运行很多次。

考虑到必须匹配的多个条件，AJAX 调用会更好吗？ (这个 JSON 是通过 PHP 动态创建的，因此我可以制作一个 PHP 函数，可以更有效地完成此操作)，或者我完全错过了有关如何在 JSON 对象中查找项目的信息？

一如既往，欢迎提出任何改进代码的建议!

编辑:
我很抱歉没有说清楚，但这个问题的目的是找到一种提高性能的方法。该页面有很多 JavaScript，我知道这是一个性能低于应有水平的位置。

Answer 1

首先，您应该衡量，并且仅在确实存在性能问题时才采取行动。您需要确切的数字，例如 200 毫秒或 80% 的时间花在此处。 “运行很多”没有任何意义。浏览器可以非常快地循环。

正如其他人提到的，您可以改进常数因子，例如使用 native for 循环而不是 jQuery.each。在这种情况下，Chaching 全局变量不会有太大帮助。

如果你真的想提高效率，你应该找到一个比 O(n) 更好的算法。假设您仅使用此数据来查找与特定条件匹配的元素，您可以使用 JS 对象作为哈希来实现 O(1) 性能。

仅举一个具体案例的示例:

var layout = {
  "2": { "2,,4,131,10,0": ["40", "93"], "2,115,4,131,0": ["41"] },
  "4": { ... },
  ...
};

在 php 中生成此输出相当容易，然后您只需使用查找来查找与您的特定条件匹配的 id。