• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (C) 2022 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16import {cpu, CpuStruct, WakeupBean} from "./ProcedureWorkerCPU.js";
17import {ColorUtils, drawFlagLine, drawLines, ns2s, ns2x, Rect} from "./ProcedureWorkerCommon.js";
18import {CpuFreqStruct, freq} from "./ProcedureWorkerFreq.js";
19import {proc, ProcessStruct} from "./ProcedureWorkerProcess.js";
20import {mem, ProcessMemStruct} from "./ProcedureWorkerMem.js";
21import {thread, ThreadStruct} from "./ProcedureWorkerThread.js";
22import {func, FuncStruct} from "./ProcedureWorkerFunc.js";
23import {fps, FpsStruct} from "./ProcedureWorkerFPS.js";
24import {heap, HeapStruct} from "./ProcedureWorkerHeap.js";
25import {timeline} from "./ProcedureWorkerTimeline.js";
26import {cpuAbility, CpuAbilityMonitorStruct} from "./ProcedureWorkerCpuAbility.js";
27import {memoryAbility, MemoryAbilityMonitorStruct} from "./ProcedureWorkerMemoryAbility.js";
28import {DiskAbilityMonitorStruct, diskIoAbility} from "./ProcedureWorkerDiskIoAbility.js";
29import {networkAbility, NetworkAbilityMonitorStruct} from "./ProcedureWorkerNetworkAbility.js";
30import {hiPerfCpu, HiPerfCpuStruct} from "./ProcedureWorkerHiPerfCPU.js";
31import {hiPerfProcess, HiPerfProcessStruct} from "./ProcedureWorkerHiPerfProcess.js";
32import {hiPerfThread, HiPerfThreadStruct} from "./ProcedureWorkerHiPerfThread.js";
33import {HiPerfEvent, HiPerfEventStruct} from "./ProcedureWorkerHiPerfEvent.js";
34import {HiPerfReportStruct} from "./ProcedureWorkerHiPerfReport.js";
35
36let dataList: any = {}
37let dataList2: any = {}
38let dataList3: any = {}
39let dataList4: any = {}
40let dataFilter: any = {}
41let canvasList: any = {}
42let contextList: any = {}
43
44function drawSelection(context: any, params: any) {
45    if (params.isRangeSelect && params.rangeSelectObject) {
46        params.rangeSelectObject!.startX = Math.floor(ns2x(params.rangeSelectObject!.startNS!, params.startNS, params.endNS, params.totalNS, params.frame));
47        params.rangeSelectObject!.endX = Math.floor(ns2x(params.rangeSelectObject!.endNS!, params.startNS, params.endNS, params.totalNS, params.frame));
48        if (context) {
49            context.globalAlpha = 0.5
50            context.fillStyle = "#666666"
51            context.fillRect(params.rangeSelectObject!.startX!, params.frame.y, params.rangeSelectObject!.endX! - params.rangeSelectObject!.startX!, params.frame.height)
52            context.globalAlpha = 1
53        }
54    }
55}
56
57function drawWakeUp(context: CanvasRenderingContext2D | any, wake: WakeupBean | null, startNS: number, endNS: number, totalNS: number, frame: Rect, selectCpuStruct: CpuStruct | undefined = undefined, currentCpu: number | undefined = undefined) {
58    if (wake) {
59        let x1 = Math.floor(ns2x((wake.wakeupTime || 0), startNS, endNS, totalNS, frame));
60        context.beginPath();
61        context.lineWidth = 2;
62        context.fillStyle = "#000000";
63        if (x1 > 0 && x1 < frame.x + frame.width) {
64            context.moveTo(x1, frame.y);
65            context.lineTo(x1, frame.y + frame.height);
66            if (currentCpu == wake.cpu) {
67                let centerY = Math.floor(frame.y + frame.height / 2);
68                context.moveTo(x1, centerY - 6);
69                context.lineTo(x1 + 4, centerY);
70                context.lineTo(x1, centerY + 6);
71                context.lineTo(x1 - 4, centerY);
72                context.lineTo(x1, centerY - 6);
73                context.fill();
74            }
75        }
76        if (selectCpuStruct) {
77            let x2 = Math.floor(ns2x((selectCpuStruct.startTime || 0), startNS, endNS, totalNS, frame));
78            let y = frame.y + frame.height - 10;
79            context.moveTo(x1, y);
80            context.lineTo(x2, y);
81
82            let s = ns2s((selectCpuStruct.startTime || 0) - (wake.wakeupTime || 0));
83            let distance = x2 - x1;
84            if (distance > 12) {
85                context.moveTo(x1, y);
86                context.lineTo(x1 + 6, y - 3);
87                context.moveTo(x1, y);
88                context.lineTo(x1 + 6, y + 3);
89                context.moveTo(x2, y);
90                context.lineTo(x2 - 6, y - 3);
91                context.moveTo(x2, y);
92                context.lineTo(x2 - 6, y + 3);
93                let measure = context.measureText(s);
94                let tHeight = measure.actualBoundingBoxAscent + measure.actualBoundingBoxDescent
95                let xStart = x1 + Math.floor(distance / 2 - measure.width / 2);
96                if (distance > measure.width + 4) {
97                    context.fillStyle = "#ffffff"
98                    context.fillRect(xStart - 2, y - 4 - tHeight, measure.width + 4, tHeight + 4);
99                    context.font = "10px solid";
100                    context.fillStyle = "#000000";
101                    context.textBaseline = "bottom";
102                    context.fillText(s, xStart, y - 2);
103                }
104
105            }
106        }
107        context.strokeStyle = "#000000";
108        context.stroke();
109        context.closePath();
110    }
111}
112
113function drawLoading(ctx: CanvasRenderingContext2D, startNS: number, endNS: number, totalNS: number, frame: any, left: number, right: number) {
114}
115
116self.onmessage = function (e: any) {
117    if ((e.data.type as string).startsWith("clear")) {
118        dataList = {};
119        dataList2 = {};
120        dataList3 = {};
121        dataList4 = {};
122        dataFilter = {};
123        canvasList = {};
124        contextList = {};
125        // @ts-ignore
126        self.postMessage({
127            id: e.data.id,
128            type: e.data.type,
129            results: null,
130        });
131        return;
132    }
133    let res: any
134    if (e.data.params.list) {
135        dataList[e.data.type] = e.data.params.list;
136        if (e.data.params.offscreen) {
137            canvasList[e.data.type] = e.data.params.offscreen;
138            contextList[e.data.type] = e.data.params.offscreen!.getContext('2d');
139            contextList[e.data.type].scale(e.data.params.dpr, e.data.params.dpr);
140        }
141    }
142    if (!dataFilter[e.data.type]) {
143        dataFilter[e.data.type] = []//new Set();
144    }
145    let canvas = canvasList[e.data.type];
146    let context = contextList[e.data.type];
147    let type = e.data.type as string;
148    let params = e.data.params;
149    let online = e.data.params.online;
150    let buf = e.data.params.buf;
151    let isRangeSelect = e.data.params.isRangeSelect;
152    let isHover = e.data.params.isHover;
153    let xs = e.data.params.xs;
154    let frame = e.data.params.frame;
155    let flagMoveInfo = e.data.params.flagMoveInfo;
156    let flagSelectedInfo = e.data.params.flagSelectedInfo;
157    let hoverX = e.data.params.hoverX;
158    let hoverY = e.data.params.hoverY;
159    let startNS = e.data.params.startNS;
160    let endNS = e.data.params.endNS;
161    let totalNS = e.data.params.totalNS;
162    let slicesTime: { startTime: number | null, endTime: number | null, color: string | null } = e.data.params.slicesTime;
163    let range = e.data.params.range;
164    let scale = e.data.params.scale;
165    let canvasWidth = e.data.params.canvasWidth;
166    let canvasHeight = e.data.params.canvasHeight;
167    let useCache = e.data.params.useCache;
168    let lineColor = e.data.params.lineColor;
169    let wakeupBean: WakeupBean | null = e.data.params.wakeupBean;
170    let intervalPerf: number = e.data.params.intervalPerf;
171    let lazyRefresh = false;
172    if (canvas) {
173        if (canvas.width !== canvasWidth || canvas.height !== canvasHeight) {
174            canvas.width = canvasWidth;
175            canvas.height = canvasHeight;
176            context.scale(e.data.params.dpr, e.data.params.dpr);
177        }
178    }
179    if (type.startsWith("timeline")) {
180        timeline(canvas, context, startNS, endNS, totalNS, frame,
181            e.data.params.keyPressCode, e.data.params.keyUpCode,
182            e.data.params.mouseDown, e.data.params.mouseUp,
183            e.data.params.mouseMove, e.data.params.mouseOut,
184            e.data.params.offsetLeft, e.data.params.offsetTop,
185            (a: any) => {
186                //@ts-ignore
187                self.postMessage({
188                    id: "timeline",
189                    type: "timeline-range-changed",
190                    results: a,
191                });
192            }
193        );
194        // @ts-ignore
195        self.postMessage({
196            id: e.data.id,
197            type: type,
198            results: null,
199        });
200    } else if (type.startsWith("cpu")) {
201        if (lazyRefresh) {
202            cpu(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
203        } else {
204            if (!useCache) {
205                cpu(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
206            }
207        }
208        if (canvas) {
209            context.clearRect(0, 0, canvas.width, canvas.height);
210            let arr = dataFilter[type];
211            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
212                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur)
213            }
214            context.beginPath();
215            drawLines(context, xs, frame.height, lineColor);
216            CpuStruct.hoverCpuStruct = undefined;
217            if (isHover) {
218                for (let re of dataFilter[e.data.type]) {
219                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
220                        CpuStruct.hoverCpuStruct = re;
221                        break;
222                    }
223                }
224            } else {
225                CpuStruct.hoverCpuStruct = e.data.params.hoverCpuStruct;
226            }
227            CpuStruct.selectCpuStruct = e.data.params.selectCpuStruct;
228            context.font = "11px sans-serif";
229            for (let re of dataFilter[type]) {
230                CpuStruct.draw(context, re);
231            }
232            drawSelection(context, params);
233            context.closePath();
234            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
235            let currentCpu = parseInt(type.replace("cpu", ""));
236            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame, type == `cpu${CpuStruct.selectCpuStruct?.cpu || 0}` ? CpuStruct.selectCpuStruct : undefined, currentCpu);
237        }
238        // @ts-ignore
239        self.postMessage({
240            id: e.data.id,
241            type: type,
242            results: canvas ? undefined : dataFilter[type],
243            hover: CpuStruct.hoverCpuStruct
244        });
245    } else if (type.startsWith("fps")) {
246        if (lazyRefresh) {
247            fps(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
248        } else {
249            if (!useCache) {
250                fps(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
251            }
252        }
253        if (canvas) {
254            context.clearRect(0, 0, canvas.width, canvas.height);
255            let arr = dataFilter[type];
256            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
257                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
258            }
259            context.beginPath();
260            drawLines(context, xs, frame.height, lineColor)
261            FpsStruct.hoverFpsStruct = undefined;
262            if (isHover) {
263                for (let re of dataFilter[e.data.type]) {
264                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
265                        FpsStruct.hoverFpsStruct = re;
266                        break;
267                    }
268                }
269            } else {
270                FpsStruct.hoverFpsStruct = e.data.params.hoverFpsStruct;
271            }
272            for (let re of dataFilter[type]) {
273                FpsStruct.draw(context, re)
274            }
275            drawSelection(context, params);
276            context.closePath();
277            let maxFps = FpsStruct.maxFps + "FPS"
278            let textMetrics = context.measureText(maxFps);
279            context.globalAlpha = 0.8
280            context.fillStyle = "#f0f0f0"
281            context.fillRect(0, 5, textMetrics.width + 8, 18)
282            context.globalAlpha = 1
283            context.fillStyle = "#333"
284            context.textBaseline = "middle"
285            context.fillText(maxFps, 4, 5 + 9);
286            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
287            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
288        }
289        // @ts-ignore
290        self.postMessage({
291            id: e.data.id,
292            type: type,
293            results: canvas ? undefined : dataFilter[type],
294            hover: FpsStruct.hoverFpsStruct
295        });
296    } else if (type.startsWith("freq")) {
297        if (lazyRefresh) {
298            freq(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
299        } else {
300            if (!useCache) {
301                freq(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
302            }
303        }
304        if (canvas) {
305            context.clearRect(0, 0, canvas.width, canvas.height);
306            let arr = dataFilter[type];
307            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
308                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
309            }
310            context.beginPath();
311            CpuFreqStruct.maxFreq = e.data.params.maxFreq;
312            CpuFreqStruct.maxFreqName = e.data.params.maxFreqName;
313            drawLines(context, xs, frame.height, lineColor)
314            CpuFreqStruct.hoverCpuFreqStruct = undefined;
315            if (isHover) {
316                for (let re of dataFilter[type]) {
317                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
318                        CpuFreqStruct.hoverCpuFreqStruct = re;
319                        break;
320                    }
321                }
322            } else {
323                CpuFreqStruct.hoverCpuFreqStruct = e.data.params.hoverCpuFreqStruct;
324            }
325            CpuFreqStruct.selectCpuFreqStruct = e.data.params.selectCpuFreqStruct;
326            for (let re of dataFilter[type]) {
327                CpuFreqStruct.draw(context, re)
328            }
329            drawSelection(context, params);
330            context.closePath();
331            let s = CpuFreqStruct.maxFreqName
332            let textMetrics = context.measureText(s);
333            context.globalAlpha = 0.8
334            context.fillStyle = "#f0f0f0"
335            context.fillRect(0, 5, textMetrics.width + 8, 18)
336            context.globalAlpha = 1
337            context.fillStyle = "#333"
338            context.textBaseline = "middle"
339            context.fillText(s, 4, 5 + 9)
340            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
341            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
342        }
343        // @ts-ignore
344        self.postMessage({
345            id: e.data.id,
346            type: type,
347            results: canvas ? undefined : dataFilter[type],
348            hover: CpuFreqStruct.hoverCpuFreqStruct
349        });
350    } else if (type.startsWith("process")) {
351        if (lazyRefresh) {
352            proc(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
353        } else {
354            if (!useCache) {
355                proc(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
356            }
357        }
358        if (canvas) {
359            context.clearRect(0, 0, canvas.width, canvas.height);
360            let arr = dataFilter[type];
361            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
362                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur)
363            }
364            context.beginPath();
365            CpuStruct.cpuCount = e.data.params.cpuCount;
366            drawLines(context, xs, frame.height, lineColor)
367            let path = new Path2D();
368            let miniHeight: number = 0;
369            miniHeight = Math.round((frame.height - (CpuStruct.cpuCount * 2)) / CpuStruct.cpuCount)
370            context.fillStyle = ColorUtils.colorForTid(e.data.params.pid || 0)
371            for (let re of dataFilter[type]) {
372                ProcessStruct.draw(context, path, re, miniHeight);
373            }
374            context.fill(path);
375            drawSelection(context, params);
376            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
377            context.closePath();
378            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
379        }
380        // @ts-ignore
381        self.postMessage({id: e.data.id, type: type, results: canvas ? undefined : dataFilter[type], hover: undefined});
382    } else if (type.startsWith("heap")) {
383        if (lazyRefresh) {
384            heap(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
385        } else {
386            if (!useCache) {
387                heap(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
388            }
389        }
390        if (canvas) {
391            context.clearRect(0, 0, canvas.width, canvas.height);
392            let arr = dataFilter[type];
393            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
394                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur)
395            }
396            context.beginPath();
397            drawLines(context, xs, frame.height, lineColor)
398            HeapStruct.hoverHeapStruct = undefined;
399            if (isHover) {
400                for (let re of dataFilter[e.data.type]) {
401                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
402                        HeapStruct.hoverHeapStruct = re;
403                        break;
404                    }
405                }
406            } else {
407                HeapStruct.hoverHeapStruct = e.data.params.hoverHeapStruct;
408            }
409            for (let re of dataFilter[type]) {
410                HeapStruct.draw(context, re)
411            }
412            drawSelection(context, params);
413            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
414            context.closePath();
415            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
416        }
417        // @ts-ignore
418        self.postMessage({
419            id: e.data.id,
420            type: type,
421            results: canvas ? undefined : dataFilter[type],
422            hover: HeapStruct.hoverHeapStruct
423        });
424    } else if (type.startsWith("mem")) {
425        if (lazyRefresh) {
426            mem(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
427        } else {
428            if (!useCache) {
429                mem(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
430            }
431        }
432        if (canvas) {
433            context.clearRect(0, 0, canvas.width, canvas.height);
434            let arr = dataFilter[type];
435            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
436                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur)
437            }
438            context.beginPath();
439            drawLines(context, xs, frame.height, lineColor)
440            ProcessMemStruct.hoverProcessMemStruct = undefined;
441            if (isHover) {
442                for (let re of dataFilter[type]) {
443                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
444                        ProcessMemStruct.hoverProcessMemStruct = re;
445                        break;
446                    }
447                }
448            } else {
449                ProcessMemStruct.hoverProcessMemStruct = e.data.params.hoverProcessMemStruct;
450            }
451            for (let re of dataFilter[type]) {
452                ProcessMemStruct.draw(context, re)
453            }
454            drawSelection(context, params);
455            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
456            context.closePath();
457            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
458        }
459        // @ts-ignore
460        self.postMessage({
461            id: e.data.id,
462            type: type,
463            results: canvas ? undefined : dataFilter[type],
464            hover: ProcessMemStruct.hoverProcessMemStruct
465        });
466    } else if (type.startsWith("thread")) {
467        if (lazyRefresh) {
468            thread(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
469        } else {
470            if (!useCache) {
471                thread(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
472            }
473        }
474        if (canvas) {
475            context.clearRect(0, 0, canvas.width, canvas.height);
476            let arr = dataFilter[type];
477            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
478                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur)
479            }
480            context.beginPath();
481            drawLines(context, xs, frame.height, lineColor)
482            ThreadStruct.hoverThreadStruct = undefined;
483            if (isHover) {
484                for (let re of dataFilter[e.data.type]) {
485                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
486                        ThreadStruct.hoverThreadStruct = re;
487                        break;
488                    }
489                }
490            } else {
491                ThreadStruct.hoverThreadStruct = e.data.params.hoverThreadStruct;
492            }
493            ThreadStruct.selectThreadStruct = e.data.params.selectThreadStruct;
494            for (let re of dataFilter[type]) {
495                ThreadStruct.draw(context, re)
496            }
497            drawSelection(context, params);
498            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
499            context.closePath();
500            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
501        }
502        // @ts-ignore
503        self.postMessage({
504            id: e.data.id,
505            type: type,
506            results: canvas ? undefined : dataFilter[type],
507            hover: ThreadStruct.hoverThreadStruct
508        });
509    } else if (type.startsWith("func")) {
510        if (!e.data.params.isLive){
511            self.postMessage({
512                id: e.data.id,
513                type: type,
514                results: canvas ? undefined : dataFilter[type],
515                hover: undefined
516            });
517            return;
518        }
519        if (lazyRefresh) {
520            func(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
521        } else {
522            if (!useCache) {
523                func(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
524            }
525        }
526        if (canvas) {
527            if (canvas.height == 150) {
528                canvas.width = frame.width;
529                canvas.height = e.data.params.maxHeight;
530                context.scale(e.data.params.dpr, e.data.params.dpr);
531            }
532            context.clearRect(0, 0, canvas.width, canvas.height);
533            let arr = dataFilter[type];
534            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
535                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startTs, arr[arr.length - 1].startTs + arr[arr.length - 1].dur)
536            }
537            context.beginPath();
538            drawLines(context, xs, frame.height, lineColor)
539            FuncStruct.hoverFuncStruct = undefined;
540            if (isHover) {
541                for (let re of dataFilter[type]) {
542                    if (re.dur == 0 || re.dur == null || re.dur == undefined) {
543                        if (re.frame && hoverX >= re.frame.x - 5 && hoverX <= re.frame.x + 5 && hoverY >= re.frame.y + (re.depth * 20) && hoverY <= re.frame.y + re.frame.height + (re.depth * 20)) {
544                            FuncStruct.hoverFuncStruct = re;
545                            break;
546                        }
547                    } else {
548                        if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y + (re.depth * 20) && hoverY <= re.frame.y + re.frame.height + (re.depth * 20)) {
549                            FuncStruct.hoverFuncStruct = re;
550                            break;
551                        }
552                    }
553                }
554            } else {
555                FuncStruct.hoverFuncStruct = e.data.params.hoverFuncStruct;
556            }
557            FuncStruct.selectFuncStruct = e.data.params.selectFuncStruct;
558            for (let re of dataFilter[type]) {
559                FuncStruct.draw(context, re, totalNS)
560            }
561            drawSelection(context, params);
562            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
563            context.closePath();
564            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
565        }
566        // @ts-ignore
567        self.postMessage({
568            id: e.data.id,
569            type: type,
570            results: canvas ? undefined : dataFilter[type],
571            hover: FuncStruct.hoverFuncStruct
572        });
573    } else if (type.startsWith("native")) {
574        if (canvas) {
575            context.clearRect(0, 0, canvas.width, canvas.height);
576            context.beginPath();
577            drawLines(context, xs, frame.height, lineColor)
578            drawSelection(context, params);
579            context.closePath();
580            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
581        }
582        // @ts-ignore
583        self.postMessage({
584            id: e.data.id,
585            type: type,
586            results: canvas ? undefined : dataFilter[type],
587            hover: ThreadStruct.hoverThreadStruct
588        });
589    } else if (type.startsWith("HiPerf-Group") || type.startsWith("monitorGroup")) {
590        if (canvas) {
591            context.clearRect(0, 0, canvas.width, canvas.height);
592            context.beginPath();
593            drawLines(context, xs, frame.height, lineColor)
594            drawSelection(context, params);
595            context.closePath();
596            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
597        }
598        // @ts-ignore
599        self.postMessage({
600            id: e.data.id,
601            type: type,
602            results: canvas ? undefined : dataFilter[type],
603            hover: ThreadStruct.hoverThreadStruct
604        });
605    } else if (type.startsWith("HiPerf-Cpu")) {
606        let groupBy10MS = scale > 100_000_000;
607        if (lazyRefresh) {
608            hiPerfCpu(dataList[type], dataList2, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, e.data.params.maxCpu, intervalPerf, useCache || !range.refresh);
609        } else {
610            if (!useCache) {
611                hiPerfCpu(dataList[type], dataList2, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, e.data.params.maxCpu, intervalPerf, false);
612            }
613        }
614        if (canvas) {
615            context.clearRect(0, 0, canvas.width, canvas.height);
616            let arr = dataFilter[type];
617            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
618                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
619            }
620            drawLines(context, xs, frame.height, lineColor)
621            context.stroke();
622            context.beginPath();
623            HiPerfCpuStruct.hoverStruct = undefined;
624            if (isHover) {
625                let offset = groupBy10MS ? 0 : 3;
626                for (let re of dataFilter[e.data.type]) {
627                    if (re.frame && hoverX >= re.frame.x - offset && hoverX <= re.frame.x + re.frame.width + offset) {//&& hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height
628                        HiPerfCpuStruct.hoverStruct = re;
629                        break;
630                    }
631                }
632            } else {
633                HiPerfCpuStruct.hoverStruct = e.data.params.hoverStruct;
634            }
635            HiPerfCpuStruct.selectStruct = e.data.params.selectStruct;
636            context.fillStyle = ColorUtils.FUNC_COLOR[0];
637            context.strokeStyle = ColorUtils.FUNC_COLOR[0];
638            let path = new Path2D();
639            for (let re of dataFilter[type]) {
640                HiPerfCpuStruct.draw(context, path, re, groupBy10MS);
641            }
642            if (groupBy10MS) {
643                context.fill(path);
644            } else {
645                context.stroke(path);
646            }
647            drawSelection(context, params);
648            context.closePath();
649            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
650        }
651        // @ts-ignore
652        self.postMessage({
653            id: e.data.id,
654            type: type,
655            results: canvas ? undefined : dataFilter[type],
656            hover: HiPerfCpuStruct.hoverStruct
657        });
658    } else if (type.startsWith("HiPerf-Process")) {
659        let groupBy10MS = scale > 100_000_000;
660        if (lazyRefresh) {
661            hiPerfProcess(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, useCache || !range.refresh);
662        } else {
663            if (!useCache) {
664                hiPerfProcess(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, false);
665            }
666        }
667        if (canvas) {
668            context.clearRect(0, 0, canvas.width, canvas.height);
669            let arr = dataFilter[type];
670            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
671                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
672            }
673            drawLines(context, xs, frame.height, lineColor)
674            context.stroke();
675            context.beginPath();
676            HiPerfProcessStruct.hoverStruct = undefined;
677            context.fillStyle = ColorUtils.FUNC_COLOR[0];
678            context.strokeStyle = ColorUtils.FUNC_COLOR[0];
679            if (isHover) {
680                let offset = groupBy10MS ? 0 : 3;
681                for (let re of dataFilter[e.data.type]) {
682                    if (re.frame && hoverX >= re.frame.x - offset && hoverX <= re.frame.x + re.frame.width + offset) {//&& hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height
683                        HiPerfProcessStruct.hoverStruct = re;
684                        break;
685                    }
686                }
687            } else {
688                HiPerfProcessStruct.hoverStruct = e.data.params.hoverStruct;
689            }
690            HiPerfProcessStruct.selectStruct = e.data.params.selectStruct;
691            let path = new Path2D();
692            for (let re of dataFilter[type]) {
693                HiPerfProcessStruct.draw(context, path, re, groupBy10MS);
694            }
695            groupBy10MS ? context.fill(path) : context.stroke(path);
696            context.closePath();
697            drawSelection(context, params);
698            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
699        }
700        // @ts-ignore
701        self.postMessage({
702            id: e.data.id,
703            type: type,
704            results: canvas ? undefined : dataFilter[type],
705            hover: HiPerfProcessStruct.hoverStruct
706        });
707    } else if (type.startsWith("HiPerf-Thread")) {
708        let groupBy10MS = scale > 100_000_000;
709        if (lazyRefresh) {
710            hiPerfThread(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, useCache || !range.refresh);
711        } else {
712            if (!useCache) {
713                hiPerfThread(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, false);
714            }
715        }
716        if (canvas) {
717            context.clearRect(0, 0, canvas.width, canvas.height);
718            let arr = dataFilter[type];
719            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
720                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
721            }
722            drawLines(context, xs, frame.height, lineColor)
723            context.stroke();
724            context.beginPath();
725            HiPerfThreadStruct.hoverStruct = undefined;
726            context.fillStyle = ColorUtils.FUNC_COLOR[0];
727            context.strokeStyle = ColorUtils.FUNC_COLOR[0];
728            if (isHover) {
729                let offset = groupBy10MS ? 0 : 3;
730                for (let re of dataFilter[e.data.type]) {
731                    if (re.frame && hoverX >= re.frame.x - offset && hoverX <= re.frame.x + re.frame.width + offset) {//&& hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height
732                        HiPerfThreadStruct.hoverStruct = re;
733                        break;
734                    }
735                }
736            } else {
737                HiPerfThreadStruct.hoverStruct = e.data.params.hoverStruct;
738            }
739            HiPerfThreadStruct.selectStruct = e.data.params.selectStruct;
740            let path = new Path2D();
741            for (let re of dataFilter[type]) {
742                HiPerfThreadStruct.draw(context, path, re, groupBy10MS);
743            }
744            groupBy10MS ? context.fill(path) : context.stroke(path);
745            context.stroke();
746            context.closePath();
747            drawSelection(context, params);
748            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
749        }
750        // @ts-ignore
751        self.postMessage({
752            id: e.data.id,
753            type: type,
754            results: canvas ? undefined : dataFilter[type],
755            hover: HiPerfThreadStruct.hoverStruct
756        });
757    } else if (type.startsWith("monitorCpu")) {
758        if (lazyRefresh) {
759            cpuAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
760        } else {
761            if (!useCache) {
762                cpuAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
763            }
764        }
765        if (canvas) {
766            context.clearRect(0, 0, canvas.width, canvas.height);
767            let arr = dataFilter[type];
768            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
769                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
770            }
771            context.beginPath();
772            CpuAbilityMonitorStruct.maxCpuUtilization = e.data.params.maxCpuUtilization;
773            CpuAbilityMonitorStruct.maxCpuUtilizationName = e.data.params.maxCpuUtilizationName;
774            drawLines(context, xs, frame.height, lineColor)
775            CpuAbilityMonitorStruct.hoverCpuAbilityStruct = undefined;
776            if (isHover) {
777                for (let re of dataFilter[type]) {
778                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
779                        CpuAbilityMonitorStruct.hoverCpuAbilityStruct = re;
780                        break;
781                    }
782                }
783            }
784            CpuAbilityMonitorStruct.selectCpuAbilityStruct = e.data.params.selectCpuAbilityStruct;
785            for (let re of dataFilter[type]) {
786                CpuAbilityMonitorStruct.draw(context, re)
787            }
788            drawSelection(context, params);
789            context.closePath();
790            let s = CpuAbilityMonitorStruct.maxCpuUtilizationName
791            let textMetrics = context.measureText(s);
792            context.globalAlpha = 0.8
793            context.fillStyle = "#f0f0f0"
794            context.fillRect(0, 5, textMetrics.width + 8, 18)
795            context.globalAlpha = 1
796            context.fillStyle = "#333"
797            context.textBaseline = "middle"
798            context.fillText(s, 4, 5 + 9)
799            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
800            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
801        }
802        // @ts-ignore
803        self.postMessage({
804            id: e.data.id,
805            type: type,
806            results: canvas ? undefined : dataFilter[type],
807            hover: CpuAbilityMonitorStruct.hoverCpuAbilityStruct
808        });
809    } else if (type.startsWith("monitorMemory")) {
810        if (lazyRefresh) {
811            memoryAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
812        } else {
813            if (!useCache) {
814                memoryAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
815            }
816        }
817        if (canvas) {
818            context.clearRect(0, 0, canvas.width, canvas.height);
819            let arr = dataFilter[type];
820            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
821                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
822            }
823            context.beginPath();
824            MemoryAbilityMonitorStruct.maxMemoryByte = e.data.params.maxMemoryByte;
825            MemoryAbilityMonitorStruct.maxMemoryByteName = e.data.params.maxMemoryByteName;
826            drawLines(context, xs, frame.height, lineColor)
827            MemoryAbilityMonitorStruct.hoverMemoryAbilityStruct = undefined;
828            if (isHover) {
829                for (let re of dataFilter[type]) {
830                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
831                        MemoryAbilityMonitorStruct.hoverMemoryAbilityStruct = re;
832                        break;
833                    }
834                }
835            }
836            MemoryAbilityMonitorStruct.selectMemoryAbilityStruct = e.data.params.selectMemoryAbilityStruct;
837            for (let re of dataFilter[type]) {
838                MemoryAbilityMonitorStruct.draw(context, re)
839            }
840            drawSelection(context, params);
841            context.closePath();
842            let s = MemoryAbilityMonitorStruct.maxMemoryByteName
843            let textMetrics = context.measureText(s);
844            context.globalAlpha = 0.8
845            context.fillStyle = "#f0f0f0"
846            context.fillRect(0, 5, textMetrics.width + 8, 18)
847            context.globalAlpha = 1
848            context.fillStyle = "#333"
849            context.textBaseline = "middle"
850            context.fillText(s, 4, 5 + 9)
851            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
852            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
853        }
854        // @ts-ignore
855        self.postMessage({
856            id: e.data.id,
857            type: type,
858            results: canvas ? undefined : dataFilter[type],
859            hover: MemoryAbilityMonitorStruct.hoverMemoryAbilityStruct
860        });
861
862    } else if (type.startsWith("monitorDiskIo")) {
863        if (lazyRefresh) {
864            diskIoAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh);
865        } else {
866            if (!useCache) {
867                diskIoAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false);
868            }
869        }
870        if (canvas) {
871            context.clearRect(0, 0, canvas.width, canvas.height);
872            let arr = dataFilter[type];
873            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
874                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
875            }
876            context.beginPath();
877            let maxDiskRate = e.data.params.maxDiskRate;
878            let maxDiskRateName = e.data.params.maxDiskRateName;
879            drawLines(context, xs, frame.height, lineColor)
880            DiskAbilityMonitorStruct.hoverDiskAbilityStruct = undefined;
881            if (isHover) {
882                for (let re of dataFilter[type]) {
883                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
884                        DiskAbilityMonitorStruct.hoverDiskAbilityStruct = re;
885                        break;
886                    }
887                }
888            }
889            DiskAbilityMonitorStruct.selectDiskAbilityStruct = e.data.params.selectDiskAbilityStruct;
890            for (let re of dataFilter[type]) {
891                DiskAbilityMonitorStruct.draw(context, re, maxDiskRate)
892            }
893            drawSelection(context, params);
894            context.closePath();
895            let textMetrics = context.measureText(maxDiskRateName);
896            context.globalAlpha = 0.8
897            context.fillStyle = "#f0f0f0"
898            context.fillRect(0, 5, textMetrics.width + 8, 18)
899            context.globalAlpha = 1
900            context.fillStyle = "#333"
901            context.textBaseline = "middle"
902            context.fillText(maxDiskRateName, 4, 5 + 9)
903            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
904            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
905        }
906        // @ts-ignore
907        self.postMessage({
908            id: e.data.id,
909            type: type,
910            results: canvas ? undefined : dataFilter[type],
911            hover: DiskAbilityMonitorStruct.hoverDiskAbilityStruct
912        });
913    } else if (type.startsWith("monitorNetwork")) {
914        if (lazyRefresh) {
915            networkAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, useCache || !range.refresh)
916        } else {
917            if (!useCache) {
918                networkAbility(dataList[type], dataFilter[type], startNS, endNS, totalNS, frame, false)
919            }
920        }
921        if (canvas) {
922            context.clearRect(0, 0, canvas.width, canvas.height);
923            let arr = dataFilter[type];
924            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
925                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
926            }
927            context.beginPath();
928            let maxNetworkRate = e.data.params.maxNetworkRate;
929            let maxNetworkRateName = e.data.params.maxNetworkRateName;
930            drawLines(context, xs, frame.height, lineColor)
931            NetworkAbilityMonitorStruct.hoverNetworkAbilityStruct = undefined;
932            if (isHover) {
933                for (let re of dataFilter[type]) {
934                    if (re.frame && hoverX >= re.frame.x && hoverX <= re.frame.x + re.frame.width && hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height) {
935                        NetworkAbilityMonitorStruct.hoverNetworkAbilityStruct = re;
936                        break;
937                    }
938                }
939            }
940            NetworkAbilityMonitorStruct.selectNetworkAbilityStruct = e.data.params.selectNetworkAbilityStruct;
941            for (let re of dataFilter[type]) {
942                NetworkAbilityMonitorStruct.draw(context, re, maxNetworkRate)
943            }
944            drawSelection(context, params);
945            context.closePath();
946            let textMetrics = context.measureText(maxNetworkRateName);
947            context.globalAlpha = 0.8
948            context.fillStyle = "#f0f0f0"
949            context.fillRect(0, 5, textMetrics.width + 8, 18)
950            context.globalAlpha = 1
951            context.fillStyle = "#333"
952            context.textBaseline = "middle"
953            context.fillText(maxNetworkRateName, 4, 5 + 9)
954            drawWakeUp(context, wakeupBean, startNS, endNS, totalNS, frame);
955            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
956        }
957        // @ts-ignore
958        self.postMessage({
959            id: e.data.id,
960            type: type,
961            results: canvas ? undefined : dataFilter[type],
962            hover: NetworkAbilityMonitorStruct.hoverNetworkAbilityStruct
963        });
964
965    } else if (type.startsWith("HiPerf-Report-Fold")) {
966        let groupBy10MS = scale > 100_000_000;
967        if (lazyRefresh) {
968            HiPerfEvent(dataList[type], dataList3, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, useCache || !range.refresh);
969        } else {
970            if (!useCache) {
971                HiPerfEvent(dataList[type], dataList3, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, false);
972            }
973        }
974        if (canvas) {
975            context.clearRect(0, 0, canvas.width, canvas.height);
976            let arr = dataFilter[type];
977            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
978                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
979            }
980            drawLines(context, xs, frame.height, lineColor)
981            context.stroke();
982            context.beginPath();
983            HiPerfReportStruct.hoverStruct = undefined;
984            context.fillStyle = ColorUtils.FUNC_COLOR[0];
985            context.strokeStyle = ColorUtils.FUNC_COLOR[0];
986            if (isHover) {
987                let offset = groupBy10MS ? 0 : 3;
988                for (let re of dataFilter[e.data.type]) {
989                    if (re.frame && hoverX >= re.frame.x - offset && hoverX <= re.frame.x + re.frame.width + offset) {//&& hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height
990                        HiPerfReportStruct.hoverStruct = re;
991                        break;
992                    }
993                }
994            } else {
995                HiPerfReportStruct.hoverStruct = e.data.params.hoverStruct;
996            }
997            HiPerfReportStruct.selectStruct = e.data.params.selectStruct;
998            let path = new Path2D();
999            for (let re of dataFilter[type]) {
1000                HiPerfReportStruct.draw(context, path, re, groupBy10MS);
1001            }
1002            groupBy10MS ? context.fill(path) : context.stroke(path);
1003            context.closePath();
1004            drawSelection(context, params);
1005            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
1006        }
1007        // @ts-ignore
1008        self.postMessage({
1009            id: e.data.id,
1010            type: type,
1011            results: canvas ? undefined : dataFilter[type],
1012            hover: HiPerfReportStruct.hoverStruct
1013        });
1014    } else if (type.startsWith("HiPerf-Report-Event")) {
1015        let groupBy10MS = scale > 100_000_000;
1016        if (lazyRefresh) {
1017            HiPerfEvent(dataList[type], dataList4, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, useCache || !range.refresh);
1018        } else {
1019            if (!useCache) {
1020                HiPerfEvent(dataList[type], dataList4, type, dataFilter[type], startNS, endNS, totalNS, frame, groupBy10MS, intervalPerf, false);
1021            }
1022        }
1023        if (canvas) {
1024            context.clearRect(0, 0, canvas.width, canvas.height);
1025            let arr = dataFilter[type];
1026            if (arr.length > 0 && !range.refresh && !useCache && lazyRefresh) {
1027                drawLoading(context, startNS, endNS, totalNS, frame, arr[0].startNS, arr[arr.length - 1].startNS + arr[arr.length - 1].dur)
1028            }
1029            drawLines(context, xs, frame.height, lineColor)
1030            context.stroke();
1031            context.beginPath();
1032            HiPerfEventStruct.hoverStruct = undefined;
1033            context.fillStyle = ColorUtils.FUNC_COLOR[0];
1034            context.strokeStyle = ColorUtils.FUNC_COLOR[0];
1035            if (isHover) {
1036                let offset = groupBy10MS ? 0 : 3;
1037                for (let re of dataFilter[e.data.type]) {
1038                    if (re.frame && hoverX >= re.frame.x - offset && hoverX <= re.frame.x + re.frame.width + offset) {//&& hoverY >= re.frame.y && hoverY <= re.frame.y + re.frame.height
1039                        HiPerfEventStruct.hoverStruct = re;
1040                        break;
1041                    }
1042                }
1043            } else {
1044                HiPerfEventStruct.hoverStruct = e.data.params.hoverStruct;
1045            }
1046            HiPerfEventStruct.selectStruct = e.data.params.selectStruct;
1047            let path = new Path2D();
1048            for (let re of dataFilter[type]) {
1049                HiPerfEventStruct.draw(context, path, re, groupBy10MS);
1050            }
1051            groupBy10MS ? context.fill(path) : context.stroke(path);
1052            drawSelection(context, params);
1053            let maxEvent = HiPerfEventStruct.maxEvent!.get(type) || 0;
1054            let textMetrics = context.measureText(maxEvent);
1055            context.globalAlpha = 0.8
1056            context.fillStyle = "#f0f0f0"
1057            context.fillRect(0, 5, textMetrics.width + 8, 18)
1058            context.globalAlpha = 1
1059            context.fillStyle = "#333"
1060            context.textBaseline = "middle"
1061            context.fillText(maxEvent, 4, 5 + 9);
1062            context.stroke();
1063            context.closePath();
1064            drawFlagLine(context, flagMoveInfo, flagSelectedInfo, startNS, endNS, totalNS, frame, slicesTime);
1065        }
1066        // @ts-ignore
1067        self.postMessage({
1068            id: e.data.id,
1069            type: type,
1070            results: canvas ? undefined : dataFilter[type],
1071            hover: HiPerfEventStruct.hoverStruct
1072        });
1073    }
1074};
1075self.onmessageerror = function (e: any) {
1076}
1077