代码之家  ›  专栏  ›  技术社区  ›  Tobias von Falkenhayn

如何在javascript中获取chrome性能指标

  •  -1
  • Tobias von Falkenhayn  · 技术社区  · 6 年前

    如果我使用chrome开发工具,我可以执行以下操作:

    1. 打开chrome开发工具(右键单击chrome=>inspect中的页面)
    2. 导航到“性能”选项卡
    3. 单击录制按钮
    4. 单击“我的Web应用”中的按钮
    5. 停止性能录制

    然后我在chrome的“摘要”选项卡上得到一个漂亮的小馅饼:

    enter image description here

    我的问题是:

    如何在javascript中开始录制、停止录制并获取这些摘要值(加载、脚本等)?

    如果有人能给我一个代码示例,那就太好了。

    我的问题是 关于我如何处理页面导航,因为我使用的是c selenium。我想做的是开始性能录制,使用webdriver执行一些步骤,停止录制并测量性能。

    0 回复  |  直到 6 年前
        1
  •  1
  •   Alejandro Vales user1768079    6 年前

    有两种方法可以做到:

    第一个:

    我建议你调查一下 puppeteer . 这是一个由google chrome的人完成的项目,它支持 tracing . 如你所见 https://pptr.dev/#?product=Puppeteer&version=v1.13.0&show=api-class-tracing 他们有办法 检索生成的跟踪 ,您只需将其写入计算机,以便以后使用。

    呼唤 tracing.start({}) 使用 path 它指定要将跟踪写入的文件。

    呼唤 tracing.stop() 可以很容易地与 fs 要转换的库 Buffer 输出到一个文件,稍后您可以使用 chrome dev tools 如果您不想将start函数与 路径 参数。

    唯一的缺点是,您不能真正重用您的selenium脚本,您必须或多或少地从头开始,即使puppeter声称更容易。

    第二个(稍微难一点):

    使用类似于此库的内容。 https://github.com/paulirish/automated-chrome-profiling

    它是用js编写的,如果遵循包的安装步骤,然后运行命令 node get-timeline-trace.js 并加载生成的文件( profile-XXXXXXXX.devtools.trace )对于chrome分析器,您将得到一个非常好的报告。

    我看到的唯一问题是,您必须找到一种方法来执行selenium脚本,将chrome实例传递给它,我不知道这有多容易(也许pid可以做到?)