当前位置: 首页 > 面试题库 >

我可以在单页应用程序中使用浏览器Navigation Timing API处理Ajax事件吗?如果没有,什么是好的工具?

童子明
2023-03-14
问题内容

我们有一个使用Knockout和Backbone构建的单页面应用程序,该应用程序对服务器进行Ajax调用,并执行一些复杂的数据缓存和DOM渲染。我们真的很想衡量用户所看到的性能(并将其重新登录到服务器)。我似乎无法全神贯注于浏览器Navigation
Timing API
是否对此有用。从我在示例中看到的内容来看,Navigation Timing
API是绑定的,window.performance并且仅限于页面加载,不适合监视Ajax行为。对或错?如果为假,我还能使用什么?

我很乐意设置用于测量时间的自定义检测点,例如,对于使用服务器结果执行一些DOM渲染的Ajax调用。


问题答案:

1-正确,window.performance与页面加载有关。请参见下面的示例,该示例显示了这一点:

    <button id='searchButton'>Look up Cities</button>
    <br>
    Timing info is same? <span id='results'></span>
    <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script type="text/javascript">
        jQuery('#searchButton').on('click', function(e){
            // deep copy the timing info
            var perf1 = jQuery.extend(true, {}, performance.timing);             
            // do something async
            jQuery.getJSON('http://ws.geonames.org/searchJSON?featureClass=P&style=full&maxRows=10&name_startsWith=Denv', function() {
                // get another copy of timing info
                var perf2 = jQuery.extend(true, {}, performance.timing);
                // show if timing information has changed
                jQuery('#results').text( _.isEqual( perf1, perf2 ) );
            });
            return false;
        });
    </script>

另外,即使您确实可以使用它,您也会从不支持该对象的旧浏览器中丢失数据。

2-
Boomerang项目似乎超出了Web计时API,还支持较旧的浏览器。本次会议上列出的当前维护者正在与幻灯片和示例代码进行交谈。抱歉,没有直接链接。



 类似资料:
  • 问题内容: 我已经创建了一个简单的 应用程序(使用),带有联系表单,当用户单击“提交”时,我想生成并发送电子邮件。为此,我一直试图像这样使用: …但是我在导入过程中遇到了很多错误。 我是否在这里缺少某些东西,或者根本不是为在浏览器中使用而设计的?如果是这种情况,我应该考虑其他选择吗? 问题答案: node.js用于服务器端JavaScript,它允许您执行浏览器无法完成的许多工作。 除了mailt

  • 我有一个模块化的JavaFX应用程序,具有以下Java代码: 这是模块信息。java文件: 我使用以下命令编译模块化JavaFX应用程序: 我使用以下命令打包模块化JavaFX应用程序: 然后我将应用程序保存在我的/应用程序文件夹中(我在Mac OS上),然后打开应用程序。应用程序会打开一个500x500窗口,但不会渲染任何图形,也不会打开web浏览器。应用程序只打开一个白色空白500x500窗口

  • 问题内容: 意识到React Native应用旨在使用模拟器进行开发/测试,是否可以使用Web浏览器来测试应用? 存在诸如https://rnplay.org/之类的服务,但是我担心的是,它由https://appetize.io/提供支持,可能会受到每月分钟数的限制。与付费屏幕流媒体服务相比,我还想利用免费/开源技术来实现这一目标。 沿着这些思路,为了在浏览器中测试该应用程序,是否要求该应用程序

  • 问题内容: 我正在尝试开发与Selenium一起使用的CSS选择器。特别是我想使用伪类:contains()。尽管W3的CSS3草案包含:contains(),但最终版本似乎并未包含该草案。 我正在使用Chrome的工具来帮助我检查CSS选择器,并确保我做对了。Chrome似乎没有实现:contains(),这是可以理解的。 有没有我可以使用的工具,可以让我尝试在我们的网页上使用:contains

  • 认识到React本机应用程序设计为使用模拟器开发/测试,是否可以使用web浏览器也测试应用程序? 服务,例如https://rnplay.org/ 存在,但我担心的是它是由https://appetize.io/ 它可能受到每月分钟数的限制。与付费的屏幕流媒体服务相比,我还想利用免费/开源技术来实现这一点。 按照这些思路,为了在浏览器中测试应用程序,应用程序是否需要使用一个或多个库,这些库允许应用

  • 问题内容: 我们正在使用不同的体系结构层(例如域,接口,基础结构和应用程序)构建一个小型应用程序。这遵循洋葱DDD模型。现在,我想知道将应用程序拆分为多模块Maven项目是否有任何好处。据我所知,这似乎使事情变得比所需要的更加困难。整个应用程序将作为单个WAR文件部署到Tomcat容器中。 问题答案: 拆分应用程序对以下情况有意义: 当项目的某个部分需要新功能或错误修复时,您可以仅关注该模块并为其