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