Added size support to Network tab [#Issue_6165]

[Victowolf]

Overview

This PR adds support for displaying response payload size in the Network tab
And Fixes #6165
I have introduced a new "Size" column in the network requests table and a new row displaying the response size in the Overview panel of the request inspector.

---

Changes

1. Data Model Updates

File:
packages/devtools_app/lib/src/screens/network/network_model.dart

• Added two new getters to the NetworkRequest base class:
  • requestBytes
  • responseBytes
• Implemented these getters in the Socket class using:
  • writeBytes : request size
  • readBytes : response size

Purpose:
This exposes byte-level data in a unified way for all network request types.

---

2. HTTP Data Handling

File:
packages/devtools_app/lib/src/shared/http/http_request_data.dart

• Added logic to extract response size using the content-length header.
• Handles both String and List<String> header formats.

Purpose:
This provides the response size for HTTP requests when available, without requiring changes to the Dart VM.

---

3. Network Table UI

File:
packages/devtools_app/lib/src/screens/network/network_screen.dart

• Added a new column: "Size"
• Implemented a formatter to display sizes in:
  • Bytes (B)
  • Kilobytes (KB)
  • Megabytes (MB)
• Displays - when size is unavailable.

Purpose:
To make payload size visible in the UI directly in the Network tab for quick inspection.

---

4. Request Inspector (Overview Panel)

File:
packages/devtools_app/lib/src/screens/network/network_request_inspector_views.dart

• Added a new row in the Overview tab:
  • Size
• Uses the same byte formatting as the table.

Purpose:
This provides detailed size information when inspecting a specific request.

---

5. Tests

This change is primarily UI and data exposure based on existing VM/service data, so no new unit tests were added.

---

Why request size is not included

Request size is not reliably available for HTTP requests due to limitations in the current DevTools and VM service APIs:

• The Dart VM does not expose request payload size in HttpProfileRequest.
• HTTP request bodies are not always accessible or fully captured.
• Headers such as content-length are often absent for outgoing requests.
• Streaming and chunked requests further complicate accurate measurement.

While socket-level request size (writeBytes) is available, this is not consistently applicable to HTTP requests.
Therefore, Including request size would require changes in the Dart SDK / VM layer.

For these reasons, this PR focuses on response size, which can be reliably determined using:

• Socket readBytes
• HTTP content-length header (when present)

---

The screenshot

---

Future Work

• Add request size support when reliable VM-level data becomes available.
• Introduce separate columns for request and response sizes.
• Improve accuracy via VM instrumentation for HTTP payload tracking.

---

Pre-launch Checklist

General checklist

• I read the [Contributor Guide] and followed the process outlined there for submitting PRs.
• I read the [Tree Hygiene] wiki page.
• I read the [Flutter Style Guide].
• I signed the [CLA].
• I updated/added relevant documentation.

---

Issues checklist

• I listed at least one issue that this PR fixes.

---

Tests checklist

• OR there is a reason for not adding tests, which I explained in the PR description.

---

AI-tooling checklist

• I did use AI tooling, and...
  • I reviewed all AI-generated code before opening this PR.
  • I understand and am able to discuss the code in this PR.
  • I verified the accuracy of any AI-generated text.

---

Feature-change checklist

• This PR does change the DevTools UI or behavior and...
  • I added an entry to NEXT_RELEASE_NOTES.md (will be added after PR creation).
  • I included screenshots of the UI.
  • I ran DevTools locally to verify changes.

[srawlins]

Looks great, thank you!

[srawlins]

Merge in the master branch to resolve that merge conflict.

[Victowolf]

Hi @srawlins
I’ve pushed fixes based on the failed tests.
Could you please approve the workflow so CI can run again?
Thanks!