ECharts分析xdebug跟踪日志
2015年12月23日 15:36:11 星期三
之前用的是国外的图表工具, 有点麻烦, 文档是英文的, 看着不顺眼,
发现了百度出品的ECharts, 文档比较全, 功能比较多, 做出的图也比较好看, 用起来也比较简单
先解释一下:
两个点之间上下距离相距比较大的说明这两个点之间耗费的内存比较大
两个点之间左右距离相距比较大的说明两点之间耗时比较多
单文件:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
</head>
<body>
<?php
function makeData($file)
{
$fp = fopen($file, 'r');
$arrLineData = [];
$arrDetailData = []; while(!feof($fp)){
$row = fgets($fp);
$row = trim($row);
$arr_now = preg_split('#\s+#', $row); if (count($arr_now) == 5) {
// echo '<pre>';print_r($arr_now); exit();
$x = $arr_now[0]*10000; //时间消耗, 变成整数, 单位ms*10
$y = $arr_now[1]; //内存消耗, 缩小数量级, 单位KB
$arrLineData[] = [$x, $y]; $tmp = [];
$tmp['time_used'] = $arr_now[0];
$tmp['memory_used'] = $arr_now[1];
$tmp['memory_add'] = 0;
$tmp['function'] = $arr_now[3];
$tmp['location'] = $arr_now[4];
$key = $x.'_'.$arr_now[1];
$arrDetailData[$key] = $tmp;
}
} return [$arrLineData, $arrDetailData];
} //读取xdebug trace 数据文件
$cpuData = makeData('./aaa.xt'); ?>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:800px;weight:80%"></div>
<!-- ECharts单文件引入 -->
<script src="./echarts.min.js"></script>
<script type="text/javascript">
var cpuData = <?= json_encode($cpuData)?>;
var line1Name = '跟踪'; // 基于准备好的dom，初始化echarts图表
var myChart = echarts.init(document.getElementById('main')); option = {
title : {
text: 'PHP效率分析',
//subtext: '纯属虚构'
},
tooltip : {
trigger: 'axis',
axisPointer:{
show: true,
type : 'cross',
lineStyle: {
type : 'dashed',
width : 1
}
},
formatter : function (params) {
var x = params[0].value[0];
var y = params[0].value[1]; var key = x+'_'+y;
var obj = cpuData[1][key]; str = '';
str += '时间消耗: '+obj.time_used+"s<br>";
str += '内存消耗: '+obj.memory_used/1024+"KB<br>";
// str += '内存增量: '+obj.memory_add+"B<br>";
str += '函数调用: '+obj.function+"<br>";
str += '所在行: '+obj.location;
return str; }
},
dataZoom: {
show: true,
start : 0
},
legend: {
data:[line1Name]
},
toolbox: {
show : true,
feature : {
dataView : {show: true, readOnly: true},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
xAxis : [
{
type: 'value',
axisLine: {
lineStyle: {
color:'grey',
width:1
}
}
}
],
yAxis : [
{
type: 'value',
axisLine: {
lineStyle: {
color:'grey',
width:1
}
}
}
],
series : [
{
name:line1Name,
type:'line',
data:cpuData[0],
}
]
}; // 为echarts对象加载数据
myChart.setOption(option);
</script>
</body>
</html>
两个文件:
图注:
I/O密集型: 一次mysql的联结查询的效率分析
CPU密集型: 将联结查询分成两次简单查询, 并借助PHP计算得到最终结果的效率分析
代码:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
</head>
<body>
<?php
function makeData($file)
{
$fp = fopen($file, 'r');
$arrLineData = [];
$arrDetailData = []; while(!feof($fp)){
$row = fgets($fp);
$row = trim($row);
$arr_now = preg_split('#\s+#', $row); if (count($arr_now) > 2 && is_numeric($arr_now[0])) {
$x = $arr_now[0]*10000; //时间消耗, 变成整数, 单位ms*10
$y = $arr_now[1]/1000; //内存消耗, 缩小数量级, 单位KB
$arrLineData[] = [$x, $y]; $tmp = [];
$tmp['time_used'] = $arr_now[0];
$tmp['memory_used'] = $arr_now[1];
$tmp['memory_add'] = $arr_now[2];
$tmp['function'] = $arr_now[4];
$tmp['location'] = $arr_now[5];
$key = $x.'_'.$arr_now[1];
$arrDetailData[$key] = $tmp;
}
} return [$arrLineData, $arrDetailData];
} $cpuData = makeData('./file/trace._test_index_ab_cpu_XDEBUG_TRACE=start_trace.xt');
$ioData = makeData('./file/trace._test_index_ab_io_XDEBUG_TRACE=start_trace.xt'); ?>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:400px"></div>
<!-- ECharts单文件引入 -->
<script src="./js/echarts-all.js"></script>
<script type="text/javascript">
var cpuData = <?= json_encode($cpuData)?>;
var ioData = <?= json_encode($ioData)?>;
var line1Name = 'CPU密集型';
var line2Name = 'I/O密集型'; // 基于准备好的dom，初始化echarts图表
var myChart = echarts.init(document.getElementById('main')); option = {
title : {
text: 'PHP效率分析',
//subtext: '纯属虚构'
},
tooltip : {
trigger: 'axis',
axisPointer:{
show: true,
type : 'cross',
lineStyle: {
type : 'dashed',
width : 1
}
},
formatter : function (params) {
var x = params.value[0];
var y = params.value[1]; var key = x+'_'+y*1000;
if (params.seriesName == line1Name) {
var obj = cpuData[1][key];
} else {
var obj = ioData[1][key];
}
str = params.seriesName+': <br>';
str += '时间消耗: '+obj.time_used+"s<br>";
str += '内存消耗: '+obj.memory_used/1024+"KB<br>";
str += '内存增量: '+obj.memory_add+"B<br>";
str += '函数调用: '+obj.function+"<br>";
str += '所在行: '+obj.location;
return str;
}
},
dataZoom: {
show: true,
start : 0
},
legend: {
data:[line1Name, line2Name]
},
toolbox: {
show : true,
feature : {
dataView : {show: true, readOnly: true},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
xAxis : [
{
type: 'value',
axisLine: {
lineStyle: {
color:'grey',
width:1
}
}
}
],
yAxis : [
{
type: 'value',
axisLine: {
lineStyle: {
color:'grey',
width:1
}
}
}
],
series : [
{
name:line1Name,
type:'line',
data:cpuData[0],
},
{
name:line2Name,
type:'line',
data:ioData[0]
}
]
}; // 为echarts对象加载数据
myChart.setOption(option);
</script>
</body>
</html>
ECharts分析xdebug跟踪日志的更多相关文章
- 手机自动化测试：Appium源码分析之跟踪代码分析九
手机自动化测试:Appium源码分析之跟踪代码分析九 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家 ...
- 手机自动化测试：Appium源码分析之跟踪代码分析八
手机自动化测试:Appium源码分析之跟踪代码分析八 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家 ...
- angular代码分析之异常日志设计
angular代码分析之异常日志设计 错误异常是面向对象开发中的记录提示程序执行问题的一种重要机制,在程序执行发生问题的条件下,异常会在中断程序执行,同时会沿着代码的执行路径一步一步的向上抛出异常,最 ...
- elk收集分析nginx access日志
elk收集分析nginx access日志 首先elk的搭建按照这篇文章使用elk+redis搭建nginx日志分析平台说的,使用redis的push和pop做队列,然后有个logstash_inde ...
- mysql通过查看跟踪日志跟踪执行的sql语句
在SQL SERVER下跟踪sql采用事件探查器,而在mysql下如何跟踪sql呢? 其实方法很简单,开启mysql的日志log功能,通过查看跟踪日志即可. 开启mysql的日志log方法: wind ...
- 手机自动化测试：Appium源码分析之跟踪代码分析七
手机自动化测试:Appium源码分析之跟踪代码分析七 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.poptest推出手机自 ...
- 手机自动化测试：Appium源码分析之跟踪代码分析六
手机自动化测试:Appium源码分析之跟踪代码分析六 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.poptest推出手机自 ...
- 手机自动化测试：Appium源码分析之跟踪代码分析五
手机自动化测试:Appium源码分析之跟踪代码分析五 手机自动化测试是未来很重要的测试技术,作为一名测试人员应该熟练掌握,POPTEST举行手机自动化测试的课程,希望可以训练出优秀的手机测试开发工 ...
- Dynamics CRM 2015Online Update1 new feature之 插件跟踪日志
在最新的CRM2015Online Update1版本中加入了一个新功能-插件跟踪日志,与其说是新功能更应该说是对原有功能的加强,因为ITracingService这个接口在2013中已经引入了, ...
随机推荐
- WinSCP 连接 Ubuntu 拒绝的问题
1.打开配置文件 $ sudo vi /etc/ssh/sshd_config 2.修改操作 PermitRootLogin without-password 修改为 PermitRootLogin ...
- 看懂理解 keyboard中 , navigation的设置: 切换工作区和移动窗口到不同的工作区.
navigation中, 主要有两个方面的内容: 移动窗口到工作区 的shortcuts 切换工作区的shortcuts 首先清楚: 工作区workspace, fedora 23中 好像只有上下方向 ...
- 关于动态URL地址设置静态形式
动态URL地址:http://station.com/index.php?c=play&a=index&id=12345 静态URL地址:http://station.com/play ...
- JavaScript中 window.parent 、window.top、window.self代表的含义
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...
- sql group by 理解
order by是对字段进行排序,group by 是对字段进行分类,在select 语句中可以使用group by 子句将行划分成较小的组,然后,使用组函数返回每一个组的汇总信息,另外,可以使用ha ...
- 天翼宽带政企网关B2-1P 如何获得超级管理员账号?
RT 用useradmin没办法做NAT,想进telecomadmin里面看看,,,,,并且已经使用过nE7jA%5m这个密码登录,没有用! 求办法!!! 最佳答案 查找超级管理员密码方法: 1.用光 ...
- Hibernate之映射一对一关联
一.一对一关联的概念: 一对一之间的关联是指:两张表中的信息是一对一的关系,比如我们每个人和身份证的关系,一个人对应一张身份证,一张身份证也只能对应一个人. Hibernate提供了两种映射一对一关联 ...
- Python制作统计图形
转载自:http://www.dcharm.com/?p=15 Python一般使用Matplotlib制作统计图形,用它自己的说法是‘让简单的事情简单,让复杂的事情变得可能’.(你说国外的“码农”咋 ...
- linux之awk、sed命令
总结: 两个命令的正则表达式都用''单引号进行区分. 输出变量名用单引号,输出变量值用双引号,这个在bash脚本里一般是通用的. 在bash脚本里要使用变量值,都要加上双引号 awk用法: 参考网址: ...
- 【转】MySQL数据类型和常用字段属性总结
来源:http://www.jb51.net/article/55853.htm 这里先总结数据类型.MySQL中的数据类型大的方面来分,可以分为:日期和时间.数值,以及字符串.下面就分开来进行总结. ...