Skip to content

Add advanced request filters to Network Activity #241

@V3RON

Description

@V3RON

Network Activity users need better ways to narrow down busy request logs when debugging real React Native apps. The current panel is good for small sessions, but once an app loads multiple screens, prefetches data, talks to several backends, and mixes HTTP with WebSocket or SSE traffic, a single free-text filter is not enough to isolate the request a developer cares about.

Observed Findings

The Network Activity plugin already captures a rich request list for HTTP, WebSocket, SSE, and Nitro traffic. The panel supports a free-text filter and a request-type filter for HTTP / WS / SSE, but it does not support Chrome DevTools-style property filters such as method, status code, domain, MIME type, size, source, failure state, or in-flight state.

Suggested Behavior

The Network Activity panel should support advanced filters that let users quickly isolate relevant traffic without scanning the full table manually.

From a user perspective, filtering should cover at least:

  • HTTP method
  • Status code or status range
  • Domain / host
  • Request source such as Built-in or Nitro
  • Request type / transport
  • Failed requests only
  • In-flight requests only
  • Overridden requests only
  • Content type / MIME type
  • Size and duration thresholds

The feature should feel like a natural extension of the existing filter bar, not a separate power-user tool hidden elsewhere. Users should be able to combine multiple filters in a single session and see the request list update immediately.

The filter UI should be understandable for casual users while still scaling to large logs. That could mean structured chips, dropdown-driven filters, or a property-query syntax, as long as the resulting experience makes it easy to answer questions like:

  • show me all failed POST requests
  • show me only Nitro traffic
  • show me slow requests to a specific backend
  • show me only JSON responses from one host

Filters should work consistently across the request list and should remain compatible with the existing basic text search experience.

Resolution Summary

Network Activity should let users filter traffic using practical request properties, so developers can narrow large React Native network logs down to the exact subset they need during everyday debugging.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions