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 { BaseElement, element } from '../../../../../base-ui/BaseElement'; 17import { LitTable } from '../../../../../base-ui/table/lit-table'; 18import { SelectionParam } from '../../../../bean/BoxSelection'; 19import { MemoryConfig } from '../../../../bean/MemoryConfig'; 20import { SmapsType } from '../../../../bean/SmapsStruct'; 21import { getByteWithUnit } from '../../../../database/logic-worker/ProcedureLogicWorkerCommon'; 22import { ns2s } from '../../../../database/ui-worker/ProcedureWorkerCommon'; 23import { SnapshotStruct } from '../../../../database/ui-worker/ProcedureWorkerSnapshot'; 24import { SpSystemTrace } from '../../../SpSystemTrace'; 25import { resizeObserver } from '../SheetUtils'; 26import {querySmapsRecordTabData} from "../../../../database/sql/Smaps.sql"; 27@element('tabpane-smaps-record') 28export class TabPaneSmapsRecord extends BaseElement { 29 private smapsRecordTable: LitTable | undefined | null; 30 private smapsRecordDataSource: Array<any> = []; 31 private _GLESHostCache: Array<SnapshotStruct> = []; 32 private pixelmapId = -1; 33 private typeId = SmapsType.TYPE_NATIVE_HEAP; 34 35 set GLESHostCache(value: Array<SnapshotStruct>) { 36 this._GLESHostCache = value; 37 } 38 set data(smapsValue: SelectionParam | any) { 39 this.smapsRecordDataSource = []; 40 if (smapsValue) { 41 if (this.pixelmapId == -1) { 42 for (let [key, value] of SpSystemTrace.DATA_DICT) { 43 if (value === 'pixelmap') { 44 this.pixelmapId = key; 45 break; 46 } 47 } 48 } 49 this.setSmapsRecordTableData(smapsValue.leftNs); 50 } 51 } 52 53 private async setSmapsRecordTableData(startNs: number): Promise<void> { 54 await querySmapsRecordTabData(startNs, MemoryConfig.getInstance().iPid, this.pixelmapId, this.typeId).then( 55 (results) => { 56 if (results.length > 0) { 57 let totalSize = 0; 58 let RSGSize = 0; 59 let virtaulSize = 0; 60 let currentData = this._GLESHostCache.filter((item: SnapshotStruct) => item.startNs === startNs) || []; 61 if (currentData.length === 1) { 62 // GLESHostCache === currentData[0].aSize，改值Gpu Resource泳道图中已经获取过，所以在这个sql里只是设置为0，占位置，不用多查一遍 63 RSGSize = currentData[0].aSize || 0; 64 } 65 for (let res of results) { 66 if (res.name === 'VirtaulSize') { 67 virtaulSize = res.size; 68 } else { 69 // RSGSize = RenderServiceCpu + SkiaCpu + GLESHostCache 70 RSGSize += res.size; 71 } 72 switch (res.name) { 73 case 'RenderServiceCpu': 74 this.smapsRecordDataSource.push({ name: 'RenderServiceCpu', size: getByteWithUnit(res.size) }); 75 break; 76 case 'SkiaCpu': 77 this.smapsRecordDataSource.push({ name: 'SkiaCpu', size: getByteWithUnit(res.size) }); 78 break; 79 case 'GLESHostCache': 80 let size = currentData.length > 0 ? currentData[0].aSize : 0; 81 this.smapsRecordDataSource.push({ name: 'GLESHostCache', size: getByteWithUnit(size) }); 82 break; 83 default: 84 break; 85 } 86 } 87 // ProcessCacheSize = virtaul_size - RenderServiceCpu - SkiaCpu - GLESHostCache 88 const ProcessCacheSize = virtaulSize - RSGSize; 89 // totalSize = RenderServiceCpu + SkiaCpu + GLESHostCache + ProcessCacheSize 90 totalSize = RSGSize + ProcessCacheSize; 91 this.smapsRecordDataSource.push({ name: 'ProcessCache', size: getByteWithUnit(ProcessCacheSize) }); 92 this.smapsRecordDataSource.unshift( 93 { name: 'TimeStamp', size: ns2s(startNs) }, 94 { name: 'TimeStamp(Absolute)', size: (startNs + (window as any).recordStartNS) / 1000000000 }, 95 { name: 'Total', size: getByteWithUnit(totalSize) } 96 ); 97 } 98 this.smapsRecordTable!.recycleDataSource = this.smapsRecordDataSource; 99 } 100 ); 101 } 102 103 public initElements(): void { 104 this.smapsRecordTable = this.shadowRoot?.querySelector<LitTable>('#smaps-record-tbl'); 105 } 106 107 connectedCallback() { 108 super.connectedCallback(); 109 resizeObserver(this.parentElement!, this.smapsRecordTable!); 110 new ResizeObserver(() => { 111 if (this.parentElement?.clientHeight !== 0) { 112 this.smapsRecordTable!.shadowRoot!.querySelector<HTMLDivElement>('.table')!.style.height = '100%'; 113 this.smapsRecordTable!.reMeauseHeight(); 114 } 115 }).observe(this.parentElement!); 116 } 117 public initHtml(): string { 118 return `<style> 119 :host{ 120 display: flex; 121 padding: 10px 10px; 122 flex-direction: column; 123 height: calc(100% - 20px); 124 } 125 #smaps-record-tbl{ 126 height: 100%; 127 } 128 </style> 129 <lit-table id="smaps-record-tbl" no-head> 130 <lit-table-column title="Name" data-index="name" align="flex-start" width="27%"> 131 <template><div>{{name}}</div></template> 132 </lit-table-column> 133 <lit-table-column title="size" data-index="size" align="flex-start" width="1fr"> 134 <template><div style="display: flex;">{{size}}</div></template> 135 </lit-table-column> 136 </lit-table> 137 `; 138 } 139} 140