用IE访问被测网站(我的是IE11,EDGE浏览器相同),定位到你要测试的动作所在页面或被测页面的前一页。按F12调出开发人员工具,其它的功能我就不介绍了,直接切换到性能选项卡。

根据提示按快捷键ctrl+E或点击左上角的开始按钮进行分析。

接着在被测页面做操作,这里我的操作是打开一个列表,因为系统使用过程中感觉打开列表的速度很慢。可以做多个操作一起分析,这里为了方便分析,我只测试一个事务,与loadrunner测试时设置的事务对应。

等到页面加载完毕,点击F12工具左上角的结束按钮或再次使用快捷键ctrl+E停止分析会话,等待一会儿程序分析数据生成报告图表。

报告很直观,可以拖动选择上面时间轴的区域,我们选择CPU利用率大的区域,后面的区域由于刚刚我去喝了杯水没有及时按停止所以也录了下来,其实在50秒左右事务已经完成了。下面的时间线板块,我们选择按持续时间排序,这样我们就找到了耗时最长的事件。可以把事件展开查看事件下的动作,继续分析是哪些动作导致了耗时那么长。

使用IE11的F12开发人员工具进行网页前端性能测试的更多相关文章

  1. 使用chrome的F12开发人员工具进行网页前端性能测试

    用chrome访问被测网站,定位到你要测试的动作所在页面或被测页面的前一页.按F12调出开发人员工具,其它的功能我就不介绍了,直接切换到性能选项卡Profiles. 点击start,生成ProFile ...

  2. IE11 开启F12开发人员工具中的 始终从服务器刷新

    在进行页面脚本调试时,经常需要清除浏览器缓存来获取最新的脚本文件,IE11之前的浏览器版本我们可以按F12调出开发人员工具,在缓存选项中开启"始终从服务器中刷新"的设置后我们就不需 ...

  3. windows7系统下升级到IE11时无法使用F12开发人员工具的解决办法

    windows7系统下升级到IE11时,发现F12开发人员工具无法使用,打开都是空白的 解决办法,就是下载IE11的补丁,下载地址为:https://www.microsoft.com/zh-CN/d ...

  4. F12 开发人员工具中的控制台错误消息

    使用此参考解释显示在 Internet Explorer 11 的控制台 和调试程序中的错误消息. 简介 使用 F12 开发人员工具进行调试时,错误消息(例如 EC7111 或 HTML1114)将显 ...

  5. IE的F12开发人员工具不显示

    IE的F12开发人员工具不显示问题: 按下F12之后,开发人员工具在桌面上看不到,但是任务栏里有显示.将鼠标放在任务栏的开发人员工具上,出现一片透明的区域,选中之后却出不来.将鼠标移动到开发人员工具的 ...

  6. IE的F12开发人员工具不显示 转载自:http://blog.csdn.net/longyulu/article/details/8749705

    IE的F12开发人员工具不显示问题: 按下F12之后,开发人员工具在桌面上看不到,但是任务栏里有显示.将鼠标放在任务栏的开发人员工具上,出现一片透明的区域,选中之后却出不来.将鼠标移动到开发人员工具的 ...

  7. 如何使用IE9浏览器自带开发人员工具捕获网页请求

    我们在通过浏览器访问一个网页的时候,有时候会遇到页面不能正常显示,图片不能正常加载的问题. 如果我们需要知道浏览器打开该网页时,网页中每个元素的加载情况.这时,我们便可以借助浏览器自带开发人员工具,来 ...

  8. IE11 F12 开发人员工具 查看 Cookie

    参考网址:Using the F12 developer tools in IE11 Step1 : IE11 => F12 打开 开发人员工具 Step2:开发人员工具 => 网络F5 ...

  9. IE的F12开发人员工具不显示问题

    按下F12之后,开发人员工具在桌面上看不到,但是任务栏里有显示.将鼠标放在任务栏的开发人员工具上,出现一片透明的区域,选中之后却出不来.将鼠标移动到开发人员工具的缩略图上,右键-最大化,工具就全屏出现 ...

随机推荐

  1. Node.js 抓取电影天堂新上电影节目单及ftp链接

    代码地址如下:http://www.demodashi.com/demo/12368.html 1 概述 本实例主要使用Node.js去抓取电影的节目单,方便大家使用下载. 2 node packag ...

  2. Node.app让Nodejs平台在iOS和OS X系统上奔跑

    首先呢,欢迎大家去查看相同内容的链接:http://www.livyfeel.com/nodeapp/. 由于那个平台我用的markdown语法,我也懒得改动了,就这样黏贴过来了. 这是一个惊人的恐怖 ...

  3. Leetcode Array 11 Container With Most Water

    题目: Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, a ...

  4. HDU 2242 考研路茫茫——空调教室(边双连通)

    HDU 2242 考研路茫茫--空调教室 题目链接 思路:求边双连通分量.然后进行缩点,点权为双连通分支的点权之和,缩点完变成一棵树,然后在树上dfs一遍就能得出答案 代码: #include < ...

  5. android 用webView作为编辑器 各种问题

    1.首先我要说明一下为什么要写这个博客,因为公司最近需要一个自定义的编辑器,苦于没有思路在网上找了好久,看到了好多android实现的编辑器(其实也就那么几个并不多),公司需求和网页端同步共享创建的文 ...

  6. OpenCV 中的三大数据类型( 概述 )

    前言 OpenCV 提供了许多封装好了的类型,而其中,以三大类型最为核心.本文将大致介绍这三大类型. CvArr:不确定数组 它可以被视为一个抽象基类,后面的两大类型都继承此类型并扩展.只要某个函数的 ...

  7. 高特权级代码段转向低特权级代码段(利用 ret(retf) 指令实现 jmp from ring0 to ring3)

    [0]写在前面 0.1)本代码旨在演示 从 ring0 转移到 ring3(即,从高特权级 转移到 低特权级) 0.2)本文 只对 与 门相关的 代码进行简要注释,言简意赅: 0.3)文末的个人总结是 ...

  8. uva 12083 Guardian of Decency (二分图匹配)

    uva 12083 Guardian of Decency Description Frank N. Stein is a very conservative high-school teacher. ...

  9. create-react-app创建项目报错SyntaxError: Unexpected end of JSON input while parsing near '...ttachment":false,"tar' npm代理

    SyntaxError: Unexpected end of JSON input while parsing near '...ttachment":false,"tar' 错误 ...

  10. python 基础 1.4 python运算符

    一. 布尔值: 1>True 2>False       二.关系运算符 “=” (a=b):把b的值赋给a.等号赋值   “==”(a==b): 判断a与b是否相等.返回Trule或Fl ...