IE 浏览器的无头自动化，跟踪站点渲染时间

Question

我需要监控我的网站常见任务（登录、搜索等）的渲染时间。我需要一些自动化的东西，可以模仿用户在 IE 上的操作，并能够计算页面渲染所需的时间。
自动执行示例：

1）打开无头IE浏览器

2) 转到 http://google.com

3) 输入“stackoverflow”

4) 按提交按钮

5) 启动定时器

6) 等待结果页面完全显示 渲染

7) 停止计时器

8) 关闭 IE

9）记录结果

我需要在服务器上将其作为计划任务运行，而无需用户登录。

我一直在寻找一些东西来帮助我这样做。任何人都有此类事情的经验或知道任何可以完成此任务的人吗？

Answer 1

这取决于您关注的重点：功能或性能。

功能

当监控功能时，您的目标是自动确保 Web 应用程序仍然正常工作。通常，这更多是持续集成过程的一部分，而不是生产监控的一部分。使用 HtmlUnit、Selenium 或 WebDriver 可以很好地完成此任务。不再推荐 HttpUnit （API 更底层，JavaScript 没有得到很好的支持，不太广泛采用，错误修复和增强功能较少）。

HtmlUnit 模拟浏览器。因此，您永远无法确定您的应用程序在真实浏览器中的行为是否完全相同。这对于复杂的 Ajax 应用程序尤其重要。这与 FireFox 和 Internet Explorer 之间所有小的不兼容性相当。优点：无头，易于理解。缺点：存在未被发现的不兼容性的风险。

Selenium 远程控制真实的浏览器。在我们的设置中，我们无法无头使用它，尤其是使用 Internet Explorer。但如果你将它嵌入到虚拟机中，它就会无头运行。如果您的应用程序可通过公共互联网访问，您甚至可以使用 Selenium Grid 和来自 Amazon Elastic Cloud EC2 的预配置虚拟机。 Selenium 的优点：现实世界的兼容性，易于编写脚本。缺点：仅在虚拟机中无头，性能开销，更复杂的运行时设置，仅在云中对并发用户进行压力模拟。

直到 1.5 版本，Selenium 使用名为 Selenium Core 的 JavaScript 部分来控制浏览器。如果您的应用程序对 JavaScript 有安全限制，Selenium 可能无法正常工作。

WebDriver为每个浏览器使用特定的界面，例如FireFox的扩展和Internet Explorer的自动化控件。此外，它还使用操作系统，例如用于模拟击键。这比 Selenium Core 更强大、更强大、更可靠。从 Selenium 2.0 版开始，WebDriver 已集成到 Selenium 中。但 Selenium 2.0 仍处于测试阶段。

性能

您提到使用计时器进行测量，并提到渲染时间。监控 Web 应用程序的性能时，您希望在由于应答时间过长而无法再实际使用应用程序时收到警报。

在这种情况下，您通常对以毫秒为单位的精确结果不感兴趣。您仍然可以使用上述工具之一。例如，带有 Selenium Core 的浏览器比现实世界的浏览器慢 - 但这与持续监控无关。

如果您绝对需要精确的测量，那么以上都不适合。您应该区分客户端持续时间和网络加服务器端持续时间。

• 渲染 HTML 和执行 JavaScript 需要客户端持续时间。它不依赖于并发用户的数量。您可以测量一次，例如使用Firebug。您不需要永久监视它。

• 将请求传输到服务器、处理请求并生成响应并将响应传输到客户端需要网络加服务器端持续时间。它们根据网络使用情况和并发用户数量而变化。您可以使用 JMeter 来精确测量和监控它们。但对于复杂的 Ajax 功能，在 JMeter 中模拟正确的客户端请求是一项复杂的任务。 JMeter 的优点：精确的测量，可以对具有许多并发用户的应用程序施加压力。缺点： Ajax 的限制，构建请求需要花费大量精力。

Answer 2

另一个选择可能是 Selenium Remote Control （或 Selenium 一般情况下）。

Answer 3

无头自动化的一种选择是使用 HtmlUnit。查看此链接以获取更多信息： 在 .NET 上使用 HtmlUnit 实现无头浏览器自动化

Answer 4

以下 PhantomJS 的 Headless IE 端口目前处于 Beta 版 (v0.2)：

http://triflejs.org/< /a>

这是一个快速介绍：

API 与 PhantomJs 相同，所以最终您将能够执行以下操作：

// 1. Create Page Object and navigate to Google
page = require("webpage").create();
page.open("http://www.google.com", function(status) {
    if ( status === "success" ) {
        // 2. Inject jQuery for DOM operations
        page.includeJs("http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", function() {
            // 3. Start Timer
            console.log('Start Timer: ' + (new Date()).getTime());
            // 4. Type string and click search
            page.evaluate(function() {
                $(("input[type=text")[0]).val("stackoverflow");
                $("button:contains('Google Search')).click();
            });
            // 5. Wait for loading and end timer.
            page.onLoadFinished = function() {
               console.log('Load Finished. End Timer:' + (new Date()).getTime());
               phantom.exit();
            };
        });
    }
});