Design and sizing for WebSocket support #9507

Activity

1. srawlins

   added

   enhancement

   devtools-network-screenIssues with the Network screen.Issues with the Network screen.

   P2important to work on, but not at the top of the work list.important to work on, but not at the top of the work list.

   on Nov 5, 2025
2. Victowolf commented on Feb 21, 2026

   

   Victowolf

   on Feb 21, 2026

   Contributor

   More actions

   Hi @srawlins,

   I’m Yash (VictoWolf) ,

   Continuing the discussion from #9670,

   I started with retracing the http support to understand how it was implemented, by following the above explanation given in this issue.
   I was able to create a flow:

   HttpClient()     " sdk/lib/io/  "
       ↓
   _http_impl.dart      " sdk/lib/_http/http_impl.dart "
       ↓
   _HttpProfileData   " sdk/lib/_http/http_impl.dart "
       ↓
   network_profiling.dart        " sdk/lib/io/network_profiling.dart "
       ↓
   ext.dart.io.getHttpProfile    " sdk/lib/io/network_profiling.dart "
       ↓
   VM Service JSON     " sdk/runtime/vm/ "
       ↓
   DevTools network_service.dart  " packages/devtools_app/lib/src/screens/network/network_service.dart " : flutter/DevTools 
       ↓
   network_model.dart    " packages/devtools_app/lib/src/screens/network/network_model.dart " : flutter/DevTools 
       ↓
   Network UI   " packages/devtools_app/lib/src/screens/network/network_screen.dart " : flutter/DevTools 
   

   I also mapped them to folders/file where they are implemented.

   ---

   Now for implementing WebSocket, i first noted down what all is already implemented for WebSockets.
   what i found was:

   • websocket.dart " sdk/lib/_http/ "
   • websocket_impl.dart " sdk/lib/_http/ "

   They currently handle handshakes, Frame encoding/decoding, Ping/pong & Close frames.
   But there is no profiling instrumentation like _HttpProfileData, no VM extension like: ext.dart.io.getWebSocketProfile
   This makes WebSocket traffic not surfaced in DevTools with protocol semantics (e.g., lifecycle or frame-level visibility).

   ---

   To accommodate WebSocket we can probably

   • Extend the current profiling which is for Http to represent connection-oriented protocols.
   • Record WebSocket lifecycle events (connect, message/frame send/receive, close) using a generalized profiling structure.
   • Augmenting it to the existing network profiling service extension instead of introducing a separate one.
   • Updating DevTools’ network model to handle both request-based (HTTP) and connection-based (WebSocket).

   The above plan follows for:

   I think we would want to make the support generic, and add to the http_profile package.

   ---

   For gRPC, as included in the GSOC project list, Still have to learn about it. 😅

   ---

   So, To proceed further with Sample project i wanted to clarify whether my above understanding is in right direction...?

   Thanks....
3. Victowolf commented on Feb 23, 2026

   

   Victowolf

   on Feb 23, 2026

   Last edited by Victowolf

   Contributor

   More actions

   Hi @elliette,

   After the recent update to the project list.

   I was creating plan for building the Sample project.
   I came across 2 approaches:

   ---

   Approach 1
   Create a simple ProfileableWebSocket wrapper that intercepts add() for outgoing messages and uses listen() for incoming messages.

   Approach 2
   Use a StreamTransformer to compose incoming logging via a transformed stream (e.g., customStream.listen()), and still intercept add() separately for outgoing messages.

   The 2nd approach gives more composable incoming from a Stream perspective. but have to implement add() for outgoing.
   For the prototype, I am thinking to go with approach 1, so i need some guidance here .

   ---

   I also wanted to add some extra features to the prototype, these are:

   • Lifecycle style hooking which will give more debugging info

     • After WebSocket.connect() → handshake complete
     • Inside add() → message sent
     • Inside listen() → message received
     • Inside onDone → close event
     • Inside onError → error event
       My goal is to demonstrate lifecycle capture without modifying SDK internals.

   • Connection Based Loging which will give a complete summary like

     • Duration: Total Time duration
     • Messages Sent: Total Outgoings
     • Messages Received: Total Incomings
     • Total Bytes Sent: Total outgoing size
     • Total Bytes Received: Total Incoming Size

   For the sample project would you prefer the above additions ?

   Thanks,
4. elliette commented on Feb 23, 2026

   

   elliette

   on Feb 23, 2026

   Member

   More actions

   Hi @Victowolf - this issue isn't being actively monitored, so for questions the best place to ask is https://groups.google.com/g/dart-gsoc.

   For your first question, please see this thread

   For your second question, you are welcome to add extra functionality to the starter project, those both sound like useful metrics to capture.

   Hope that helps! Please direct further questions to https://groups.google.com/g/dart-gsoc. Thanks!

   👍React with 👍1Reacted by Yash R Hosalli
5. Victowolf commented on Feb 24, 2026

   

   Victowolf

   on Feb 24, 2026

   Contributor

   More actions

   ok sure,
   That helps a lot..
   Thanks.
6. abdullah-arain9 commented on Mar 30, 2026

   

   abdullah-arain9

   on Mar 30, 2026

   More actions

   Hi Samuel,

   I am Abdullah Arain, a GSoC 2026 applicant
   for this project. I have studied this issue
   thoroughly along with all the HTTP profiling
   commits you referenced above.

   Based on your HTTP profiling implementation
   path, I built a working prototype that
   demonstrates the WebSocket instrumentation
   approach:

   github.com/abdullah-arain9/websocket-devtools-profiler

   Key achievements:

   • ProfileableWebSocket implements the full
     dart:io WebSocket interface as a drop-in
     replacement
   • Events posted via dart:developer
     Timeline.instantSync() — same mechanism
     as HTTP profiling today
   • 9 unit tests passing with MockWebSocket
     — no network required
   • Working CLI demo connected to real echo server

   My proposal follows your suggested plan exactly:

   1. Update HttpClient.enableTimelineLogging
      for WebSocket
   2. VM Service extension support
   3. http_profile package integration
   4. DevTools Network Panel WebSocket tab

   GSoC 2026 proposal submitted. Would love
   any feedback before the deadline!

   — Abdullah Arain
   github.com/abdullah-arain9
7. srawlins

   closed this as completedin #9968on Aug 26, 2026