Skip to content

Commit 603d610

Browse files
NetroScriptNetroScript
committed
Add information about the current memory region to the sidebar
This information contains both the grid and block size, as well as the warp size, but also information about the memory region like start and end address, amount of elements and the total count of accesses in this memory region. Also in the case that the memory storage did not allocate enough elements to store all accesses, display a warning in the file.
1 parent 437ead2 commit 603d610

5 files changed

Lines changed: 168 additions & 3 deletions

File tree

‎html/data/basic.json‎

Lines changed: 1 addition & 1 deletion
Large diffs are not rendered by default.

‎html/src/App.svelte‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,9 @@
2929
);
3030
3131
// Generate MemoryRegionManagers
32-
const memoryRegions: MemoryRegionManager[] = json.MemoryRegions.map((region) => new MemoryRegionManager(region));
32+
const memoryRegions: MemoryRegionManager[] = json.MemoryRegions.map(
33+
(region) => new MemoryRegionManager(region, info)
34+
);
3335
3436
// Store all our memory accesses in the memoryRegions
3537
// This is relatively slow as we need to iterate over all memory accesses and then again over all memory regions, maybe this can be optimized, but the number of memory Regions should be low, so this should not be a problem

‎html/src/components/ShowGenericInformation.svelte‎

Lines changed: 141 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,141 @@
1+
<script lang="ts">
2+
import Icon from '@iconify/svelte';
3+
import roundWarning from '@iconify/icons-ic/round-warning';
4+
5+
import { currentMemoryRegion } from '../lib/stores';
6+
import { AccordionGroup, AccordionItem } from '@skeletonlabs/skeleton';
7+
</script>
8+
9+
{#if $currentMemoryRegion.name !== undefined}
10+
<div class="variant-glass p-2 rounded-3xl text-sm mt-4">
11+
<AccordionGroup spacing="space-y-1" collapse={false}>
12+
<AccordionItem>
13+
<svelte:fragment slot="summary"
14+
><div class="text-center font-bold">Active Kernel Information</div></svelte:fragment
15+
>
16+
<svelte:fragment slot="content">
17+
<div class="text-center font-mono">Grid Sizing</div>
18+
<div class="flex flex-row justify-around">
19+
<div class="flex flex-col justify-center">
20+
<div class="text-center text-xs font-mono opacity-60">X</div>
21+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
22+
{$currentMemoryRegion.kernelSettings.GridDimensions.x}
23+
</div>
24+
</div>
25+
<div class="flex flex-col justify-center">
26+
<div class="text-center text-xs font-mono opacity-60">Y</div>
27+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
28+
{$currentMemoryRegion.kernelSettings.GridDimensions.y}
29+
</div>
30+
</div>
31+
<div class="flex flex-col justify-center">
32+
<div class="text-center text-xs font-mono opacity-60">Z</div>
33+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
34+
{$currentMemoryRegion.kernelSettings.GridDimensions.z}
35+
</div>
36+
</div>
37+
</div>
38+
39+
<div class="text-center font-mono mt-3">Block Sizing</div>
40+
<div class="flex flex-row justify-around">
41+
<div class="flex flex-col justify-center">
42+
<div class="text-center text-xs font-mono opacity-60">X</div>
43+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
44+
{$currentMemoryRegion.kernelSettings.BlockDimensions.x}
45+
</div>
46+
</div>
47+
<div class="flex flex-col justify-center">
48+
<div class="text-center text-xs font-mono opacity-60">Y</div>
49+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
50+
{$currentMemoryRegion.kernelSettings.BlockDimensions.y}
51+
</div>
52+
</div>
53+
<div class="flex flex-col justify-center">
54+
<div class="text-center text-xs font-mono opacity-60">Z</div>
55+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
56+
{$currentMemoryRegion.kernelSettings.BlockDimensions.z}
57+
</div>
58+
</div>
59+
</div>
60+
61+
<div class="text-center font-mono mt-3 mb-2">Warp Size</div>
62+
<div class="flex flex-row justify-around">
63+
<div class="flex flex-col justify-center">
64+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
65+
{$currentMemoryRegion.kernelSettings.WarpSize}
66+
</div>
67+
</div>
68+
</div>
69+
</svelte:fragment>
70+
</AccordionItem>
71+
<AccordionItem>
72+
<svelte:fragment slot="summary"
73+
><div class="text-center font-bold">Active Memory Information</div></svelte:fragment
74+
>
75+
<svelte:fragment slot="content">
76+
<div class="text-center font-mono mb-2">Name</div>
77+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-100">
78+
{$currentMemoryRegion.name}
79+
</div>
80+
81+
<div class="text-center font-mono mt-3 mb-2">Address Range</div>
82+
<div
83+
class="flex flex-row justify-around cursor-help"
84+
title="The memory region contains a total of {$currentMemoryRegion.numberOfElements} elements at a size of {$currentMemoryRegion.sizeOfSingleElement} bytes per element."
85+
>
86+
<div class="flex flex-row justify-center">
87+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
88+
{$currentMemoryRegion.startAddress}
89+
</div>
90+
<div class="text-center py-1 px-3 min-w-[16px]">-</div>
91+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[64px]">
92+
{$currentMemoryRegion.endAddress}
93+
</div>
94+
</div>
95+
</div>
96+
97+
<div class="text-center font-mono mt-3 mb-2">Logged Accesses</div>
98+
<div class="flex flex-row justify-around">
99+
<div class="flex flex-col justify-center">
100+
<div class="text-center text-xs font-mono opacity-60">Reading</div>
101+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[92px]">
102+
{$currentMemoryRegion.totalReads}
103+
</div>
104+
</div>
105+
<div class="flex flex-col justify-center">
106+
<div class="text-center text-xs font-mono opacity-60">Writing</div>
107+
<div class="text-center py-1 px-3 variant-glass rounded-xl min-w-[92px]">
108+
{$currentMemoryRegion.totalWrites}
109+
</div>
110+
</div>
111+
</div>
112+
</svelte:fragment>
113+
</AccordionItem>
114+
</AccordionGroup>
115+
116+
{#if $currentMemoryRegion.kernelSettings.CurrentSize > $currentMemoryRegion.kernelSettings.OriginalSize}
117+
<aside
118+
class="alert variant-filled-error mt-4 cursor-help"
119+
title="{$currentMemoryRegion.kernelSettings.OriginalSize} elements were allocated, {$currentMemoryRegion
120+
.kernelSettings.CurrentSize} elements were accessed"
121+
>
122+
<!-- Message -->
123+
<div class="alert-message">
124+
<div class=" text-sm flex ">
125+
<div class="local-icon-style"><Icon icon={roundWarning} width="32" height="32" /></div>
126+
The memory storage which was used to store the data was too small to fit all accesses. ({$currentMemoryRegion
127+
.kernelSettings.CurrentSize - $currentMemoryRegion.kernelSettings.OriginalSize} more elements needed to be
128+
allocated when initializing)
129+
</div>
130+
</div>
131+
</aside>
132+
{/if}
133+
</div>
134+
{/if}
135+
136+
<style>
137+
.local-icon-style {
138+
min-width: 24px;
139+
transform: translateX(-12px);
140+
}
141+
</style>

‎html/src/components/SideBar.svelte‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import { pageState } from '../lib/stores';
33
import { currentMemoryRegion, ListPlaceHolder } from '../lib/stores';
44
import { ListBox, ListBoxItem } from '@skeletonlabs/skeleton';
5+
import ShowGenericInformation from './ShowGenericInformation.svelte';
56
</script>
67

78
<div class="sidebar flex flex-col h-full overflow-y-hidden">
@@ -17,6 +18,7 @@
1718
</div>
1819

1920
<div class="flex-1" />
21+
<ShowGenericInformation />
2022
<div class="mt-auto my-1 py-2">
2123
Optionally, set a width of the Memory Region, if you have a specific 2D layout you want to visualize.
2224
</div>

‎html/src/lib/types.ts‎

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ export interface GenericInformation {
22
GridDimensions: Dimension;
33
BlockDimensions: Dimension;
44
WarpSize: number;
5+
OriginalSize: number;
6+
CurrentSize: number;
57
}
68

79
export interface MemoryRegions {
@@ -93,6 +95,8 @@ export class MemoryRegionManager {
9395
// For each index of the array data structure, we store all accesses which write to this index
9496
readonly writeAccesses: Map<number, AccessInstance[]>;
9597

98+
readonly kernelSettings: GenericInformation;
99+
96100
// Store display Settings
97101
displaySettings: MemoryRegionManagerDisplaySettings = {
98102
width: -1,
@@ -122,6 +126,18 @@ export class MemoryRegionManager {
122126
return this._highestTotalCount;
123127
}
124128

129+
// Also store how many reads and writes there are in total
130+
private _totalReads = 0;
131+
private _totalWrites = 0;
132+
133+
get totalReads(): number {
134+
return this._totalReads;
135+
}
136+
137+
get totalWrites(): number {
138+
return this._totalWrites;
139+
}
140+
125141
// For 1d arrays, we can display a sparse representation which only shows accessed addresses and not the entire memory space
126142
// if it is a normal number, it is the valid index of the array, if it is a tuple of numbers, this represents the empty spaces between memory accesses
127143
private sparse1DMemoryLocations: (number | [number, number])[] = [];
@@ -141,7 +157,7 @@ export class MemoryRegionManager {
141157
return this.highestIndex;
142158
}
143159

144-
constructor(memoryRegion: MemoryRegions) {
160+
constructor(memoryRegion: MemoryRegions, kernelSettings: GenericInformation) {
145161
this.startAddress = memoryRegion.StartAddress;
146162
this.startAddressInteger = BigInt(this.startAddress);
147163
this.endAddress = memoryRegion.EndAddress;
@@ -152,6 +168,8 @@ export class MemoryRegionManager {
152168

153169
this.readAccesses = new Map<number, AccessInstance[]>();
154170
this.writeAccesses = new Map<number, AccessInstance[]>();
171+
172+
this.kernelSettings = kernelSettings;
155173
}
156174

157175
addMemoryAccess(access: AccessInstance) {
@@ -171,6 +189,7 @@ export class MemoryRegionManager {
171189

172190
// Store the access in the read or write map and create the array if it does not exist
173191
if (access.isRead) {
192+
this._totalReads++;
174193
if (!this.readAccesses.has(access.index)) {
175194
this.readAccesses.set(access.index, []);
176195
}
@@ -183,6 +202,7 @@ export class MemoryRegionManager {
183202
}
184203

185204
if (!access.isRead) {
205+
this._totalWrites++;
186206
if (!this.writeAccesses.has(access.index)) {
187207
this.writeAccesses.set(access.index, []);
188208
}

0 commit comments

Comments
 (0)