Skip to content

Add an overview timeline to Network Activity #245

@V3RON

Description

@V3RON

Network Activity users need a visual timeline that shows how requests relate to each other over time. In real React Native apps, developers often care less about one request in isolation and more about request bursts during app startup, screen transitions, refresh actions, or realtime reconnects. A flat table makes it harder to understand concurrency, sequencing, and long-tail requests.

Observed Findings

The Network Activity plugin currently provides a sortable request list and per-request timing details, including total duration and time to first byte. However, it does not provide a Chrome DevTools-style overview timeline or waterfall-style visual context that helps users see the shape of a session at a glance.

Suggested Behavior

The Network Activity panel should include an overview timeline that helps users understand when requests happened and how they overlap.

From a user perspective, the timeline should make it easy to see:

  • bursts of traffic during app startup or screen load
  • overlapping requests versus sequential ones
  • unusually long requests standing out from the rest
  • how request activity changes across a recording window
  • how realtime connections relate to surrounding HTTP traffic

The experience should feel like a visual companion to the request list rather than a separate reporting page. Users should still be able to click through from the visual timeline into the underlying request details.

A strong outcome would be helping users quickly answer questions like:

  • which requests are slowing down this screen load
  • are these requests happening in parallel or one after another
  • what traffic pattern appears right before the bug happens
  • did this startup sequence fan out correctly or stall on one slow request

The feature should improve session comprehension at a glance, especially for larger recordings where the existing list view becomes harder to reason about temporally.

Resolution Summary

Network Activity should include an overview timeline that visualizes request activity over time, so users can understand concurrency, bursts, and slow phases in real React Native debugging sessions.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions