Skip to content

Commit 716b071

Browse files
grzgrz
committed
优化，新增mark
1 parent 8c9fe4a commit 716b071

7 files changed

+703
-50
lines changed

‎cpu.js

+91-14
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ define(function(require,exports){
2020
return false;
2121
}
2222
/**
23-
* log函数，只在CPU_DEBUGGER_TURN_ON的时候才log出来
23+
* log函数，只在cpujs_debugger 或 cpujs.TurnOn.log为true的时候才log出来
2424
*/
2525
CPUJS.log = function(s){
2626
if(!CPUJS.TurnOn.Log){
@@ -30,6 +30,21 @@ define(function(require,exports){
3030
window.console.log("### CPUJS Log:"+s);
3131
}
3232
};
33+
/**
34+
* mark功能，只在url里附加"cpujs_debugger"启动调试模式才会体现出来
35+
* 用于在cpu曲线上打出一个标志，方便调试问题
36+
* @param {String} label 要显示的文字
37+
* @param {String} color 自定义颜色
38+
* @param {String} detail Mark 的详细信息
39+
*/
40+
CPUJS.mark = function(label,color,detail){
41+
if(CPUJS.TurnOff.MARK){
42+
return;
43+
}
44+
if(CPUJS.Monitor.UI&&"function"==typeof(CPUJS.Monitor.UI.drawMark)){
45+
CPUJS.Monitor.UI.drawMark(label,color,detail);
46+
}
47+
};
3348
/**
3449
* 优先采用效率更高的Date.now，效率是new Date()3.5倍多
3550
*/
@@ -39,7 +54,7 @@ define(function(require,exports){
3954
*/
4055
CPUJS.Config = {
4156
TM_MAX_CPU:30,//设置任务调度器尽量不要超过的CPU阀值
42-
TM_MISSION_DELAY:5
57+
TM_MISSION_DELAY:5//设置单次任务执行时间超过多少ms要被log出来
4358
};
4459
/**
4560
* CPUJS的开关，用来按需选择打开一些默认不开启的功能
@@ -57,6 +72,7 @@ define(function(require,exports){
5772
CPUJS.TurnOff = {
5873
TM:false,//是否关闭任务管理器智能调度
5974
FastLoad:false,//是否关闭FastLoad
75+
MARK:false,//是否关闭Mark功能
6076
EnergySave:false//是否关闭节能功能(按需启动Monitor，当不没有服务的时候就暂停运转)
6177
};
6278
/**
@@ -71,34 +87,43 @@ define(function(require,exports){
7187
timerID:null,//定时采集数据的定时器ID
7288
lastTime:0,//上一个点的绝对时间
7389
currentTime:0,//当前点的绝对时间
74-
isPause:true,//是否被暂停
90+
isPause:null,//是否被暂停
7591
/**
7692
* 初始化
7793
*/
7894
init:function(){
95+
QZONE.console && QZONE.console.log && QZONE.console.log('CPUJS.Monitor.init(): start'); //log
96+
7997
var p = CPUJS.Monitor;
8098
if(p.hasInit){
99+
QZONE.console && QZONE.console.log && QZONE.console.log('CPUJS.Monitor.init(): have initialized, return'); //log
81100
return;
82101
}
83102
p.run();//Monitor开始工作
84103
p.hasInit = true;
85104
p.lastTime = CPUJS.now();
86105
if(CPUJS.TurnOn.Monitor){//如果需要UI渲染则拉取UI库
87-
var ui = (ua&&ua.ie<9)?'./cpu_monitor_ui_vml':'./cpu_monitor_ui_canvas';
88-
require.async(ui,function(m){
106+
var ui = (ua && ua.ie < 9) ? './cpu_monitor_ui_vml' : './cpu_monitor_ui_canvas';
107+
require.async(ui, function(m){
108+
QZONE.console && QZONE.console.log && QZONE.console.log('CPUJS.Monitor.init(): cpujs UI loaded'); //log
109+
m.ZOOM = 2;
110+
m.PANEL_WIDTH = document.body.clientWidth/2-50;
89111
CPUJS.Monitor.UI = m;
112+
CPUJS.Monitor.UI.bootstrap();
90113
});
91114
}
115+
116+
QZONE.console && QZONE.console.log && QZONE.console.log('CPUJS.Monitor.init(): end'); //log
92117
},
93118
/**
94119
* 在console打印出cpu曲线
95120
*/
96121
drawUIByConsole:function(per){
97-
var n = Math.round(per*10),s="▆";
98-
for(var i=n;i--;){
99-
s+="▆";
122+
var n = Math.round(per * 10), s="▆";
123+
for(var i = n; i--;){
124+
s += "▆";
100125
}
101-
s+=Math.round(per*100);
126+
s += Math.round(per * 100);
102127
CPUJS.log(s);
103128
},
104129
/**
@@ -155,7 +180,7 @@ define(function(require,exports){
155180
*/
156181
resume:function(){
157182
var p = CPUJS.Monitor;
158-
if(!p.isPause){
183+
if(p.isPause!=null&&!p.isPause){
159184
return;
160185
}
161186
//避免长时间的暂停跟真正的卡住搞混，所以每次重启的时候都加上一个0的数值。
@@ -502,9 +527,10 @@ define(function(require,exports){
502527
//动态调整单任务cpu参数
503528
//更大程度利用cpu资源
504529
var freePer = (p.getMaxCPU()/100)-per,c;//剩余资源
505-
if(freePer>0){
530+
if(freePer>0&&!p.Shooter.lock){
506531
c = p.GearBox.getNum();//获取可以同时执行的任务数
507-
CPUJS.log("do missions count:"+c);
532+
//CPUJS.log("do missions count:"+c);
533+
p.Shooter.lock = true;
508534
p.Shooter.exec(c);
509535
}
510536
//如果当前已经没有空余CPU资源了，则本次啥都不做，继续检测
@@ -608,11 +634,56 @@ define(function(require,exports){
608634
* 负责任务处理的模块
609635
*/
610636
Shooter:{
637+
exec1:function(count){
638+
var p = CPUJS.TM,fn,a,len,d1,d2,t1,t2,t3,_a=[],d=0,d0 = CPUJS.now();
639+
//a = p.Loader.getTask(count);//获取数量为count的一批任务
640+
while(d<CPUJS.Config.TM_MAX_CPU){
641+
console.log("ddddd:"+d+" CPUJS.Config.TM_MAX_CPU:"+CPUJS.Config.TM_MAX_CPU);
642+
a = p.Loader.getTask(1);
643+
fn = a.shift();
644+
if(isArray(fn)){
645+
_a = fn[1];
646+
fn = fn[0];
647+
}
648+
if("function"==typeof(fn)){
649+
650+
/*
651+
(function(ar){//这里不使用setTimeout的主要原因是要让几个任务同步执行，才能让cpu曲线即时有变化，才可以更好的做下一步的智能调度决策
652+
setTimeout(function(){
653+
fn.apply(null,ar);
654+
window.__c++;
655+
console.log(window.__c);
656+
},10);
657+
})(_a);
658+
*/
659+
if(!CPUJS.TurnOn.TryCatch){//调试模式下不走try catch
660+
fn.apply(null,_a);
661+
}else{
662+
try{//try catch如果没捕捉到出错其实基本上没开销；捕捉1000次有出错的才15ms开销
663+
fn.apply(null,_a);
664+
}catch(e){
665+
CPUJS.log(e);
666+
}
667+
}
668+
t2 = CPUJS.now();
669+
670+
if(t3>CPUJS.Config.TM_MISSION_DELAY){
671+
p.Stat.log(fn.toString(),t3);//记录这个任务的执行时间
672+
}
673+
d=t2-d0;
674+
continue;
675+
}
676+
d+=30;
677+
}
678+
setTimeout(function(){
679+
CPUJS.TM.Shooter.lock = false;
680+
},50);
681+
},
611682
exec:function(count){
612683
var p = CPUJS.TM,fn,a,len,d1,d2,t1,t2,t3,_a=[];
613684
a = p.Loader.getTask(count);//获取数量为count的一批任务
614685
len = a.length;
615-
var d1 = CPUJS.now();
686+
d1 = CPUJS.now();
616687
while(a.length>0){//优先执行fastQueue里面的关键任务
617688
fn = a.shift();
618689
if(isArray(fn)){
@@ -653,6 +724,9 @@ define(function(require,exports){
653724
cpuPer = Math.max(cpuPer,per);
654725
CPUJS.TM.GearBox.adjust(cpuPer);
655726
});
727+
setTimeout(function(){
728+
CPUJS.TM.Shooter.lock = false;
729+
},5);
656730
}
657731
},
658732
//vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv任务处理部分vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv
@@ -678,6 +752,7 @@ define(function(require,exports){
678752
while(p.queue.length>0){//优先执行fastQueue里面的关键任务
679753
o = p.queue.shift();
680754
_a.push("fn:"+o.fn+" time:"+o.time);
755+
CPUJS.mark(o.time,"#F00","time:"+o.time+"\n\nfn:"+o.fn);
681756
}
682757
CPUJS.log(_a.join("\n"));
683758
}
@@ -831,11 +906,13 @@ define(function(require,exports){
831906
exports.Stat = CPUJS.Monitor.Stat;
832907
exports.TurnOn = CPUJS.TurnOn;
833908
exports.TurnOff = CPUJS.TurnOff;
909+
exports.mark = CPUJS.mark;
834910
/**
835911
* 环境配置
836912
*/
837913
CPUJS.setup = function(){
838-
var pre = "cpujs_",url = location.href.toLowerCase(),k;
914+
var pre = "cpujs_", url = location.href.toLowerCase(), k;
915+
839916
if(location.href.indexOf("cpujs_debugger")>-1){
840917
CPUJS.TurnOn.Log = true;
841918
CPUJS.TurnOn.Monitor = true;

‎cpu_monitor_ui.js

+51-28
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
define(function(require,exports){
1+
define(['./cpu_monitor_ui_mark','./cpu_monitor_ui_timeline'],function(require,exports){
22

33
var CPUJS = {};
44
CPUJS.Monitor = CPUJS.Monitor || {};
5+
var Mark = require('./cpu_monitor_ui_mark');
56
/**
67
* CPUJS Monitor的UI逻辑，如果不需要画图，就不需要引入这一份逻辑
78
* @author rizenguo aka GRZ/郭小帅
89
* @type
910
*/
10-
1111
CPUJS.Monitor.UI = CPUJS.Monitor.UI || {
1212
PANEL_WIDTH:200,//CPU曲线的画布宽度200px
1313
PANEL_HEIGHT:35,//CPU曲线的画布高度35px
14-
MAX_NUM:100,//最多在面板里面画多少个点
15-
STEP_WIDTH:3,//点之间的x轴距离
14+
MAX_NUM:200,//最多在面板里面画多少个点
15+
//STEP_WIDTH:3,//点之间的x轴距离
1616
ZOOM:1,//放大多少
1717
CURRENT_X:0,//当前的x轴坐标
1818
LAST_X:0,//上一个点的x坐标
@@ -25,34 +25,27 @@ define(function(require,exports){
2525
container:null,//CPU曲线主容器
2626
hasInit:false,//只初始化一遍
2727
debugMode :false,//是否为调试模式，是的画会显示cpu曲线
28+
isPause: false,//是不是被暂停了
2829
init:function(){
2930
var p = CPUJS.Monitor.UI;
3031
p.debugMode = true;
31-
32-
//p.debugMode = false;
3332
if(CPUJS.Monitor.UI.Accessory.isHidden){
3433
CPUJS.Monitor.UI.Accessory.CloseBtn.show();
3534
return;
3635
}
3736

3837
if(p.debugMode&&!p.canvas){
39-
p.ZOOM = 2;//window.CPU_DEBUGGER_ZOOM;
38+
//p.ZOOM = 2;//window.CPU_DEBUGGER_ZOOM;
4039
p.PANEL_WIDTH*=p.ZOOM;
4140
p.PANEL_HEIGHT*=p.ZOOM;
4241
p.STEP_WIDTH = p.PANEL_WIDTH/p.MAX_NUM;
4342
p.LAST_Y = p.PANEL_HEIGHT;
4443
p.initContainer();
45-
/*if(!p.Drawer.initCanvas()){
46-
return;
47-
}*/
4844
CPUJS.Monitor.UI.Accessory.init();
49-
50-
/*var ui = (ua&&ua.ie<9)?'cpu_monitor_ui_vml':'cpu_monitor_ui_canvas';
51-
require.async(ui,function(m){
52-
debugger;
53-
CPUJS.Monitor.UI.Drawer = m;
54-
});*/
45+
p.initTimeline();
5546
}
47+
48+
5649

5750
if(p.hasInit){
5851
return;
@@ -62,6 +55,9 @@ define(function(require,exports){
6255
},
6356
draw:function(per){
6457
var p = CPUJS.Monitor.UI;
58+
if(p.isPause){
59+
return;
60+
}
6561
if(p.debugMode){//可视化
6662
var y =p.PANEL_HEIGHT-(per*p.PANEL_HEIGHT),x = p.CURRENT_X+p.STEP_WIDTH;
6763
p.Drawer.PercentNum.show(Math.round(per*100));
@@ -70,24 +66,58 @@ define(function(require,exports){
7066
p.LAST_X = po[0];
7167
p.LAST_Y = po[1];
7268
p.point_list.push([p.PANEL_WIDTH,y]);
73-
p.Drawer.drawline();
69+
p.Drawer.drawLine();
7470
}else{
7571
p.Drawer.drawPoint(x,y);
7672
p.point_list.push([x,y]);
7773
}
7874
}
7975
},
76+
drawMark:function(label,color,detail){
77+
CPUJS.Monitor.UI.Mark.draw(label,color,detail);
78+
},
8079
initContainer:function(){
8180
var c = document.createElement("DIV");
8281
c.id = "qz_cpu_container";
8382
document.body.appendChild(c);
84-
c.style.cssText = "position:fixed;left:0px;top:0px;z-index:99999;cursor:pointer";
83+
c.style.cssText = "position:fixed;left:0px;top:20px;z-index:99999;cursor:pointer";
8584
var c1 = document.createElement("DIV");
8685
c1.id = "cpujs_monitor_ui_accessory_container";
8786
c.appendChild(c1);
8887
CPUJS.Monitor.UI.container = c1;
8988
QZFL.dragdrop.registerDragdropHandler(c,c);
9089
},
90+
initTimeline:function(){
91+
var c = document.createElement("DIV"),p = CPUJS.Monitor.UI;
92+
c.id = "qz_cpu_timeline_container";
93+
p.container.appendChild(c);
94+
95+
p.TimeLine = require('./cpu_monitor_ui_timeline');
96+
p.TimeLine.bootstrap(p.PANEL_WIDTH,p.STEP_WIDTH,c);
97+
},
98+
/**
99+
* 用于在曲线上打一些标签，方便调试
100+
*/
101+
Mark:{
102+
/**
103+
* 在当前位置打一个标签，方便调试时知道程序运行到哪里
104+
* @param {String} label 在Mark里面写的信息
105+
* @param {String} color 自定义颜色
106+
* @param {String} detail Mark 的详细信息
107+
*/
108+
draw:function(label,color,detail){
109+
var m = Mark.make(label,CPUJS.Monitor.UI.LAST_X,color,detail);
110+
CPUJS.Monitor.UI.container.appendChild(m);
111+
//debugger;
112+
//console.log("CPUJS.Monitor.UI.container:"+CPUJS.Monitor.UI.container+" label:"+m.id);
113+
},
114+
/**
115+
* 用于控制Mark对象的位移
116+
*/
117+
move:function(){
118+
Mark.move(CPUJS.Monitor.UI.STEP_WIDTH);
119+
}
120+
},
91121
Drawer:{
92122

93123
}
@@ -127,7 +157,8 @@ define(function(require,exports){
127157
b.style.cssText = "text-align:center;display:inline-block;border:1px solid;width:50px;background-color:black;color:#00FF00;";
128158
ns.btnDom = b;
129159
CPUJS.Monitor.UI.Accessory.btnContainer.appendChild(b);
130-
$j(b).click(ns[name]);
160+
b.onclick = ns[name];
161+
//$j(b).click(ns[name]);
131162
},
132163
CloseBtn:{
133164
btnDom:null,
@@ -156,12 +187,7 @@ define(function(require,exports){
156187
isPause:false,
157188
pause:function(){
158189
var p = CPUJS.Monitor.UI.Accessory.PauseBtn;
159-
p.isPause = !p.isPause;
160-
if(p.isPause){
161-
CPUJS.Monitor.pause();
162-
}else{
163-
CPUJS.Monitor.resume();
164-
}
190+
CPUJS.Monitor.UI.isPause = p.isPause = !p.isPause;
165191
p.btnDom.innerHTML = p.isPause?"resume":"pause";
166192
}
167193
},
@@ -189,9 +215,6 @@ define(function(require,exports){
189215
}
190216
};
191217

192-
193-
CPUJS.Monitor.UI.init();
194-
195218
return CPUJS.Monitor.UI;
196219

197220
});

0 commit comments

Comments
 (0)