0

我正在使用 knockout.js 来呈现我的视图，我正在从服务器获取数据并像这样绑定..

var viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel, $("#macro-wrapper")[0]);

我的观点......我已经修剪了一些......但绑定是一样的......

<div data-bind="foreach: Data">
<h3>
    <a href="#" data-bind="text: Site.Name"></a>
</h3>
<div id="">
    <div data-bind="foreach: Comments">
        <div class="">
            <div class="" data-bind="click: $root.showContent">
            <a ></a>
            </div>
            <span>
                <a data-bind="attr: { 'href': Url }, text: SomeText"></a>
            </span>
            <span class="">
                <span class="" data-bind="text: ADate"></span>
            </span>
        </div>
    </div>
</div>

数据包含一个对象数组，每个对象中都有另一个数组……大约有 500 个项目需要渲染。

虽然我一直在测试，但我没有遇到任何问题，但是在部署时，我不知道它是否是慢速电脑，但他们得到了“这个脚本正在执行慢 - 停止？” 信息。如果您单击“否”几次，它将呈现。

在淘汰赛中处理大数据集的技术是什么？理想情况下，我希望渲染异步完成，让用户在忙于工作时继续他们的事情......

这些属性实际上不需要是可观察的——这是一次渲染……什么都不会改变。为了方便起见，我使用了映射 API。

更新：好的，所以我进行了更改，不再使用映射 api - 页面正在加载，但仍然很慢......有什么想法吗？改变：var viewModel = data;

4

2 回答 2

2

每个元素都会触发 click 事件。这以前发生在我身上。

关于之前发帖人所说的：在一个页面上绑定 500 个元素，之前我不得不在一个页面上绑定 500+ 个元素，而且在更现代的浏览器上性能成本几乎可以忽略不计（您可能会看到 Ie 7- 的速度有所下降） 8，但还不错）。我建议在转换大型 json 对象时不要使用映射插件。KO 映射将每个元素与每个其他元素进行比较（以检查唯一性），因此您可以了解为什么转换 500 个项目会减慢速度。

于 2012-05-12T13:12:45.367 回答
0

我认为从 UI 的角度来看，在页面上显示 500 个项目并不是一个好主意。也许您应该只显示顶级项目并具有“显示评论”链接，并且仅在用户请求时才呈现评论。或者仅使用子项渲染前 X 个顶级项目并具有“显示更多”链接。或者使用上述技术的组合。无论如何，这就是我在我的网站上解决相同问题的计划。

于 2012-04-24T15:42:02.353 回答