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 { ColorUtils } from "../../component/trace/base/ColorUtils.js"; 17import { 18 BaseStruct, 19 drawFlagLine, 20 drawLines, 21 drawLoading, 22 drawSelection, drawWakeUp, 23 ns2x, PerfRender, Render, 24 RequestMessage 25} from "./ProcedureWorkerCommon.js"; 26 27export class MemRender extends Render{ 28 render(req: RequestMessage, list: Array<any>, filter: Array<any>) { 29 if (req.lazyRefresh) { 30 mem(list, filter, req.startNS, req.endNS, req.totalNS, req.frame, req.useCache || !req.range.refresh); 31 } else { 32 if (!req.useCache) { 33 mem(list, filter, req.startNS, req.endNS, req.totalNS, req.frame, false); 34 } 35 } 36 if (req.canvas) { 37 req.context.clearRect(0, 0, req.frame.width, req.frame.height); 38 let arr = filter; 39 if (arr.length > 0 && !req.range.refresh && !req.useCache && req.lazyRefresh) { 40 drawLoading(req.context, req.startNS, req.endNS, req.totalNS, req.frame, arr[0].startTime, arr[arr.length - 1].startTime + arr[arr.length - 1].dur) 41 } 42 req.context.beginPath(); 43 drawLines(req.context, req.xs, req.frame.height, req.lineColor) 44 ProcessMemStruct.hoverProcessMemStruct = undefined; 45 if (req.isHover) { 46 for (let re of filter) { 47 if (re.frame && req.hoverX >= re.frame.x && req.hoverX <= re.frame.x + re.frame.width && req.hoverY >= re.frame.y && req.hoverY <= re.frame.y + re.frame.height) { 48 ProcessMemStruct.hoverProcessMemStruct = re; 49 break; 50 } 51 } 52 } else { 53 ProcessMemStruct.hoverProcessMemStruct = req.params.hoverProcessMemStruct; 54 } 55 for (let re of filter) { 56 ProcessMemStruct.draw(req.context, re) 57 } 58 drawSelection(req.context, req.params); 59 drawWakeUp(req.context, req.wakeupBean, req.startNS, req.endNS, req.totalNS, req.frame); 60 req.context.closePath(); 61 drawFlagLine(req.context, req.flagMoveInfo, req.flagSelectedInfo, req.startNS, req.endNS, req.totalNS, req.frame, req.slicesTime); 62 } 63 // @ts-ignore 64 self.postMessage({ 65 id: req.id, 66 type: req.type, 67 results: req.canvas ? undefined : filter, 68 hover: ProcessMemStruct.hoverProcessMemStruct 69 }); 70 } 71} 72 73function setMemFrame(node: any, padding: number, startNS: number, endNS: number, totalNS: number, frame: any) { 74 let x1: number; 75 let x2: number; 76 if ((node.startTime || 0) <= startNS) { 77 x1 = 0; 78 } else { 79 x1 = ns2x((node.startTime || 0), startNS, endNS, totalNS, frame); 80 } 81 if ((node.startTime || 0) + (node.duration || 0) >= endNS) { 82 x2 = frame.width; 83 } else { 84 x2 = ns2x((node.startTime || 0) + (node.duration || 0), startNS, endNS, totalNS, frame); 85 } 86 let getV: number = x2 - x1 <= 1 ? 1 : x2 - x1; 87 if (!node.frame) { 88 node.frame = {}; 89 } 90 node.frame.x = Math.floor(x1); 91 node.frame.y = Math.floor(frame.y + padding); 92 node.frame.width = Math.ceil(getV); 93 node.frame.height = Math.floor(frame.height - padding * 2); 94} 95 96export function mem(list: Array<any>, res: Array<any>, startNS: number, endNS: number, totalNS: number, frame: any, use: boolean) { 97 if (use && res.length > 0) { 98 for (let i = 0, len = res.length; i < len; i++) { 99 if ((res[i].startTime || 0) + (res[i].duration || 0) > startNS && (res[i].startTime || 0) < endNS) { 100 setMemFrame(res[i], 5, startNS, endNS, totalNS, frame) 101 }else{ 102 res[i].frame = null; 103 } 104 } 105 return; 106 } 107 res.length = 0; 108 if (list) { 109 for (let i = 0, len = list.length; i < len; i++) { 110 let it = list[i]; 111 if ((it.startTime || 0) + (it.duration || 0) > startNS && (it.startTime || 0) < endNS) { 112 setMemFrame(list[i], 5, startNS, endNS, totalNS, frame) 113 if (i > 0 && ((list[i - 1].frame?.x || 0) == (list[i].frame?.x || 0) && (list[i - 1].frame?.width || 0) == (list[i].frame?.width || 0))) { 114 115 } else { 116 res.push(list[i]) 117 } 118 } 119 } 120 } 121} 122 123export class ProcessMemStruct extends BaseStruct { 124 static hoverProcessMemStruct: ProcessMemStruct | undefined; 125 trackId: number | undefined 126 processName: string | undefined 127 pid: number | undefined 128 upid: number | undefined 129 trackName: string | undefined 130 type: string | undefined 131 track_id: string | undefined 132 value: number | undefined 133 startTime: number | undefined 134 duration: number | undefined 135 maxValue: number | undefined 136 delta: number | undefined; 137 138 static draw(ctx: CanvasRenderingContext2D, data: ProcessMemStruct) { 139 if (data.frame) { 140 let width = data.frame.width || 0; 141 ctx.fillStyle = ColorUtils.colorForTid(data.maxValue || 0) 142 ctx.strokeStyle = ColorUtils.colorForTid(data.maxValue || 0) 143 if (data.track_id === ProcessMemStruct.hoverProcessMemStruct?.track_id && data.startTime === ProcessMemStruct.hoverProcessMemStruct?.startTime) { 144 ctx.lineWidth = 1; 145 ctx.globalAlpha = 0.6; 146 let drawHeight: number = Math.floor(((data.value || 0) * (data.frame.height || 0) * 1.0) / (data.maxValue || 0)); 147 ctx.fillRect(data.frame.x, data.frame.y + data.frame.height - drawHeight, width, drawHeight) 148 ctx.beginPath() 149 ctx.arc(data.frame.x, data.frame.y + data.frame.height - drawHeight, 3, 0, 2 * Math.PI, true) 150 ctx.fill() 151 ctx.globalAlpha = 1.0; 152 ctx.stroke(); 153 ctx.beginPath() 154 ctx.moveTo(data.frame.x + 3, data.frame.y + data.frame.height - drawHeight); 155 ctx.lineWidth = 3; 156 ctx.lineTo(data.frame.x + width, data.frame.y + data.frame.height - drawHeight) 157 ctx.stroke(); 158 } else { 159 ctx.globalAlpha = 0.6; 160 ctx.lineWidth = 1; 161 let drawHeight: number = ((data.value || 0) * (data.frame.height || 0) * 1.0) / (data.maxValue || 1); 162 ctx.fillRect(data.frame.x, data.frame.y + data.frame.height - drawHeight, width, drawHeight) 163 } 164 } 165 ctx.globalAlpha = 1.0; 166 ctx.lineWidth = 1; 167 } 168}