渲染复杂的json和过滤

Question

尝试使用过滤实现一个选择框我遇到了一些性能问题（初始加载时间是不可接受的 - 特别是在IE中）渲染一个繁重的复杂（大约30个类别，每个类别包含大约30个主题，每个主题都支持10个主题）json使用KnockoutJS。

[
   {
      "id":0,
      "name":"Category #1",
      "subjects":[
         {
            "id":1,
            "name":"Subject #1",
            "topics":[
               {
                  "name":"Topic #1"
               },
               ...
            ]
         },
         ...
      ]
   },
   ...
]

尝试使用嵌套的foreach bings：

<ul class="categories" data-bind="foreach: data">
        <li class="category">
            <span data-bind="text: name"></span>
            <ul data-bind="foreach: subjects">
                <li class="subject">
                    <span data-bind="text: name"></span>
                    <ul data-bind="foreach: topics">
                        <li class="topic">
                            <span data-bind="text: name"></span>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>

您能建议如何使其正常工作吗？也许有一些插件可以做到这一点？