Knockout 是一个缓慢的框架吗？答案

【问题标题】：Is Knockout a slow framework?Knockout 是一个缓慢的框架吗？
【发布时间】：2013-12-21 08:20:48
【问题描述】：

我想使用淘汰赛将我的 ASP.NET MVC 应用程序转换为一个。

转换我的第一个视图后，我注意到淘汰赛需要更长的时间来渲染与 MVC 相同数量的数据。这是显示列表名称的淘汰代码。

<html>
<head>
    <script src="../../Assets/knockout/js/knockout-3.0.0.js" ></script>
</head>
<body>
    <ul data-bind="foreach: lists, visible: lists().length > 0">
        <li>
            <strong data-bind="text: title" ></strong>              
        </li> 
    </ul>
    <script type="text/javascript">    
        function List(data) {
            this.title = ko.observable(data.Title);
        }

        function ListViewModel() {
            var self = this;
            self.lists = ko.observableArray([]);

            $.getJSON("/home", function (json) {
                var data = JSON.parse(json);
                var mappedlists = $.map(data, function (item) {
                    return new List(item);
                });
                self.lists(mappedlists);
            });
        }
        ko.applyBindings(new ListViewModel());
    </script>
</body>

我确定淘汰赛不会那么慢，这里有什么我遗漏的地方

注意：为了比较，我在同一个视图（并排）上使用了两者来查看哪个首先出现

【问题讨论】：

在第一种情况下，页面到达时已格式化。在页面加载后第二秒下载内容并开始格式化，因此它必须更慢。
@Emil 谢谢，我在同一页面上检查性能是错误的。即使淘汰赛更快，它也会稍后呈现。

标签： javascript asp.net-mvc knockout.js

【解决方案1】：

由于您的页面需要额外调用（和页面加载），所以速度较慢。

我建议在渲染视图时摆脱getJSON 调用并注入您的模型：

<script type="text/javascript">
    // our model data

    var data = @Html.Raw(JsonConvert.SerializeObject(this.Model));

    // start knockout

    MyEntity.Init(data);
</script>

【讨论】：

你可能需要“安装包 Newtonsoft.Json”

【解决方案2】：

在这种简单的情况下，使用敲除没有意义，因为您没有从双向数据绑定中受益。您所做的只是显示一些数据。如果您使用的是 ASP.NET MVC，则可以使用 Razor 从服务器端呈现此数据。使用淘汰赛是有意义的，然后您想要制作交互式屏幕。您也可以使用像Durandal 这样的框架来构建企业级单页应用程序。它使用敲除进行数据绑定，在我看来，它为标准 ASP.NET MVC 应用程序提供了真正的性能优势。

【讨论】：

我分享的代码是我用来检查淘汰赛与 mvc 的性能的代码。完整的应用程序本身就是一个 lob 应用程序。

【解决方案3】：

您无法比较淘汰赛和 ASP.NET MVC 之间的性能。一个是客户端框架，另一个是服务器端。

它们都在完全不同的环境中运行，因此开始比较是没有用的。

此外，我不会称并排运行两个页面来查看哪个页面首先出现是一个不错的性能指标。

【讨论】：

这是制作 Web lob 应用程序的众多方法中的两种，性能是帮助人们做出决定的标准。所以我不会说它没用。虽然我同意并排运行不是比较性能的方式。
虽然您当然可以使用 MVC 或 Knockout 测试特定页面的渲染速度是否更快，但您需要的是 MVC 和 Knockout 之间的速度比较。这根本不可能，因为他们做的事情非常不同

【解决方案4】：

您可以通过从控制器直接向视图发送数据来摆脱这种情况。这可以帮助您避免对服务器的不必要的 ajax 调用。示例如下：

在控制器中方法：

return View(<viewmodel class name>);

然后在视图中您可以在应用淘汰绑定之前使用它：

var jsonData = new HtmlString(new JavaScriptSerializer().Serialize(this.Model));

然后可以在淘汰视图模型中传递这个对象。

【讨论】：