Added size support to Network tab (#9744)
## Overview
This PR adds support for displaying response payload size in the Network tab
and fixes #6165.
It introduces a new **"Size"** column in the network requests table and displays 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:**
Expose 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:**
Provide response size for HTTP requests when available, without requiring changes to the Dart VM.
---
### 3. Shared Utility
**File:**
`packages/devtools_app/lib/src/screens/network/utils/http_utils.dart`
* Moved `formatBytes` into a reusable utility function
* Uses **decimal (base-10) units** (`kB`, `MB`) to align with Chrome DevTools
* Handles null and negative values safely
**Purpose:**
Ensure consistent formatting across the network table and inspector views.
---
### 4. Network Table UI
**File:**
`packages/devtools_app/lib/src/screens/network/network_screen.dart`
* Added a new column: **"Size"**
* Displays formatted response size
* Shows `-` when size is unavailable
---
### 5. Request Inspector (Overview Panel)
**File:**
`packages/devtools_app/lib/src/screens/network/network_request_inspector_views.dart`
* Added a new row:
* **Response Size**
* Uses shared `formatBytes` utility
---
### 6. Tests
* Added unit tests for:
* `formatBytes` utility in `http_utils_test.dart`
* `responseBytes` parsing logic in `http_request_data.dart`
* Covers edge cases including:
* string and list headers
* invalid values
* null handling
---
## 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 complicate accurate measurement
While socket-level request size (`writeBytes`) is available, it is not consistently applicable to HTTP requests.
Therefore, including request size would require changes in the Dart SDK / VM layer.
This PR focuses on **response size**, which can be reliably determined using:
* Socket `readBytes`
* HTTP `content-length` header (when present)
---
## Screenshot
<img width="1359" height="882" alt="Screenshot 2026-03-27 233804" src="https://github.com/user-attachments/assets/4ddce5eb-1a4b-4a9e-80b6-cd16fa226c13" />
---
## Future Work
* Add request size support when VM-level data becomes available
* Introduce separate request/response size columns
* Improve accuracy via VM instrumentation
---
### General checklist
* [x] I read the Contributor Guide
* [x] I read the Tree Hygiene guidelines
* [x] I followed the Flutter Style Guide
* [x] I signed the CLA
* [x] I updated relevant documentation
---
### Issues checklist
* [x] This PR fixes #6165
---
### Tests checklist
* [x] Added unit tests for new functionality
---
### AI-tooling checklist
* [x] I used AI tooling responsibly and verified all generated content
---
### Feature-change checklist
* [x] This PR changes DevTools UI
* [x] Added entry to `NEXT_RELEASE_NOTES.md`
* [x] Included screenshots
* [x] Verified changes locally
