diff --git a/meshview/templates/node.html b/meshview/templates/node.html
index 1eae671..0483059 100644
--- a/meshview/templates/node.html
+++ b/meshview/templates/node.html
@@ -258,15 +258,17 @@
-
-
- | Time |
- Packet ID |
- From |
- To |
- Port |
-
-
+
+
+ | Time |
+ Packet ID |
+ From |
+ To |
+ Port |
+ Size |
+
+
+
@@ -821,21 +823,25 @@ async function loadPackets(filters = {}) {
` ⮕`;
}
+ const sizeBytes = packetSizeBytes(pkt);
+
list.insertAdjacentHTML("afterbegin", `
-
- | ${localTime} |
- ▶
-
- ${pkt.id}
-
- |
- ${fromCell} |
- ${toCell} |
- ${portLabel(pkt.portnum)}${inlineLinks} |
-
-
- | ${safePayload} |
-
`);
+
+ | ${localTime} |
+ ▶
+
+ ${pkt.id}
+
+ |
+ ${fromCell} |
+ ${toCell} |
+ ${portLabel(pkt.portnum)}${inlineLinks} |
+ ${sizeBytes.toLocaleString()} B |
+
+
+ | ${safePayload} |
+
`);
+
}
}
@@ -1327,6 +1333,24 @@ document.addEventListener("DOMContentLoaded", async () => {
});
});
+
+function packetSizeBytes(pkt) {
+ if (!pkt) return 0;
+
+ // Prefer raw payload length
+ if (pkt.payload) {
+ return new TextEncoder().encode(pkt.payload).length;
+ }
+
+ // Fallbacks (if you later add protobuf/base64)
+ if (pkt.raw_payload) {
+ return atob(pkt.raw_payload).length;
+ }
+
+ return 0;
+}
+
+
async function loadNodeStats(nodeId) {
try {
const res = await fetch(