在iPad上，MVC 4网站非常缓慢

Question

在iPad上，MVC 4网站非常缓慢

javascriptc#asp.netipadasp.net-mvc-4

5

我使用MVC 4开发了一个销售点系统。在Windows和Mac上，响应速度和加载时间是瞬间的，但在iPad上，加载页面或执行添加商品等操作需要8-13秒。为了提高Web应用程序的速度，我在IIS中启用了压缩，并对所有JavaScript文件进行了缩小处理。我还使用了绑定来将以下.js文件捆绑在一起，据说可以改善页面的加载：

jquery-1.8.2.min.js
knockout-2.2.0.js
jquery.easing.1.3.js
b.popup.min.js（仅用于显示模态弹出窗口，大小为6KB）

我在页面上使用的其他JavaScript文件大小在5KB到15KB之间。尽管经过这些处理，应用程序似乎快了几秒钟，但仍然需要不可接受的长时间（8-10秒）。

是否有人在iPad上遇到类似的性能问题，如何解决？还有什么其他方法可以提高性能？

我正在使用Windows Server 2003和IIS 6.0。

这是我的绑定注册代码：

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
        "~/Scripts/jquery-1.8.2.min.js",
        "~/Scripts/jquery.easing.1.3.js",
        "~/Scripts/knockout-2.2.0.js",
        "~/Scripts/common/common.min.js",
        "~/Scripts/popup.min.js"
        ));

    bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
    BundleTable.EnableOptimizations = true;
}

这是我在主页面上调用它的地方：

@using System.Configuration
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <title>Prestige SSC</title>
    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
    @Styles.Render("~/Content/css")   
    <script type="text/javascript">
        var screenRefreshTime = '@ConfigurationManager.AppSettings["ScreenRefreshTime"].ToString()';
        screenRefreshTime = parseInt(screenRefreshTime);
    </script>
</head>
<body>
    @RenderBody()
</body>
</html>

- Denys Wessels

1

请指定您验证的iPad版本。您的网站在所有iPad版本上都运行缓慢吗？问题的原因可能是客户端数据绑定（正如我所看到的，您使用了Knockout）。因此，我认为您应该朝这个方向看。 - Maxim Kornilov

似乎所有的iPad都很慢。我已经尝试了2、3和Air。 - Denys Wessels

screenRefreshTime = parseInt(screenRefreshTime); 你也在iPad上刷新屏幕吗？这可能会导致问题。 - Bart Calixto

将站点加载的瀑布视图发布出来会很有帮助。还有您尝试将脚本移到底部了吗？ - Mandar Limaye

当页面中的HTML元素数量增加时，Knockout和许多类似的双向绑定框架变得非常缓慢。免责声明：我是Atoms.js的作者，我们专门创建了Atoms.js框架来解决移动/平板电脑和其他轻量设备中的绑定和JavaScript速度问题。http://github.com/neurospeech/atoms.js - Akash Kava

显示剩余2条评论

4个回答

2

当涉及到网站性能时，可能会有无数种问题。问题不一定是由JavaScript文件引起的。以下是几个可能对你有所帮助的方法：

将iPad连接到Mac / PC并启用Safari Web Inspector工具。使用Web Inspector工具，您可以看到哪个进程花费了最长时间。请参见：https://developer.apple.com/library/iad/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html
查看此免费电子书中的可能修复列表：http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/entrypage/avoid-find-fix-asp-problems
尝试在iPad上使用Chrome运行。Chrome被认为具有最快的JavaScript引擎。还要尝试远程调试iPad的Chrome。 Chrome的开发人员工具具有JavaScript分析器，可检查哪些特定代码/函数滞后。请参见：http://blog.prototest.com/guide-to-remote-debugging-ios-and-android-mobile-devices。
您还可以远程调试基于Android的平板电脑。如果在Android平板电脑上发生相同的情况，请使用PC Chrome远程调试您的移动设备。
您的网络是否阻止某些设备的流量？
优化您的Knockout代码。 Knockout很棒，但您可能会过度使用其自动UI刷新和依赖项跟踪。
优化您的JavaScript代码。通过jshint.com或jslint.com运行您的代码。

- stack247

1

尝试下载Wireshark到服务器，启动它，并在捕获数据包流时重新创建错误。然后找到该应用程序的数据包，右键单击并选择“跟随TCP流”。您将能够查看和过滤出那些数据包。

您需要查找入站请求和出站响应，以了解服务器响应所需的时间。如果时间很快<100ms，则必须查看IPAD的每个后续请求需要多长时间。通过查看跟踪中的相对时间列，您应该能够轻松地发现延迟的位置。

从那里，如果这是纯客户端问题，您需要专注于设备端。如果这是网络问题，那么您至少可以排除应用程序。如果这是应用程序问题，那么您将能够看到需要纠正的内容。

请记住，在客户端启动应用程序之前，所有网络事物都必须准备就绪，例如在任何数据包飞行之前必须进行DNS解析。您可能还会注意到发送了一个或多个重复的数据包。这通常是错误的桥接或路由器问题的指示。也可能存在所谓的跳数问题，即设备需要经过的路由器数量导致延迟。还可能存在路由器“呼吸”问题，即路由器的流量超载（架构称“只需丢弃数据包”）。当发生这种情况时，TCP会尝试重试，实际上使情况变得更糟。

- JWP

1

使用Wireshark https://www.wireshark.org 检查您的服务器网络活动。

我曾经遇到过这样的问题，即服务器尝试使用NetBIOS和ICMP连接客户端以解析客户端详细信息，并且出现了超时问题。

在服务器上禁用TCP上的NetBIOS，然后检查它是否是网络问题而不是编程问题。

转到控制面板并选择网络连接。
右键单击要静态配置的本地连接，然后单击“属性”。
单击Internet协议（TCP / IP），单击“属性”，单击“高级”，然后单击WINS选项卡。
单击“禁用TCP / IP上的NetBIOS”。

- Gavin Mannion

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- ymz · Accepted Answer

对于iPad（以及任何其他具有不是IE 8或更低版本的浏览器的设备/平台），jQuery 2 的性能表现更好。实际上，jQuery 的体积很大，在旧版中它承载了许多不相关的验证和向后兼容性内容。

因此，您可以尝试：

替换jQuery的版本
将jQuery的包含命令与其余部分分离，并使用if语句确定是否需要较旧或较新的jQuery版本

简而言之（基于此帖子Detect Internet explorer browser version problems）

var jQuery = "~/Scripts/jquery-2.1.1.min.js";

if ((Request.Browser.Browser == "IE") && ((Request.Browser.MajorVersion < 9)))
{
    jQuery = "~/Scripts/jquery-1.8.2.min.js";
}

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    jQuery,
    "~/Scripts/jquery.easing.1.3.js",
    "~/Scripts/knockout-2.2.0.js",
    "~/Scripts/common/common.min.js",
    "~/Scripts/popup.min.js"
    ));