Show aggregated others flow2 #66
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This prepares the "Top Talkers" chart to visualize an aggregated "Other Flows" category, which will eventually be provided by the backend. This makes the chart more comprehensive by accounting for all measured traffic. The D3.js chart rendering logic in `jittertrap-chart-toptalk.js` has been updated to: - Recognize a reserved flow key of "other". - Conditionally render the legend text as "Other Flows" for this key, instead of attempting to parse it for IP/port details. - Apply a distinct, neutral grey color to the "other" flow in the stacked area chart, the distribution bar, and the legend to visually distinguish it from the top 10 flows. The frontend is now ready to correctly display this data once the backend implementation is complete.
This commit introduces a new feature to the Top Talkers chart that aggregates all flows not in the top 10 into a single 'Other' data series for visualization. The backend identifies a candidate pool of the top N flows (defined by `MAX_FLOWS`, e.g., 20) and sends them to the frontend without any pre-aggregation of "other" traffic. This number of flows in the pool and messages must be bounded, and the chosen value must be sufficiently large to deal with Rank Volatiliy, where flows enter or leave the top-k displayed flows. The aggregation logic is implemented in the Javascript frontend. - It receives the larger candidate pool of flows from the backend. - It separates the top 10 flows for individual display in the chart legend. - It then aggregates the remaining flows (flows 11-20) into a single 'Other' data series, which is rendered on the chart with a distinct color and label. - The `jittertrap-core.js` module is updated to ensure the full candidate pool is passed to the charting component instead of being truncated to 10.
There was a problem hiding this comment.
Pull Request Overview
This PR implements flow aggregation functionality to display "Other Flows" when there are more than 10 top network flows. The changes enable the frontend to aggregate flows beyond the top 10 into a single "Other" category while maintaining performance by increasing the backend's flow transmission capacity.
- Increases the backend's message capacity from 10 to 20 flows to provide more data for frontend aggregation
- Implements frontend logic to aggregate flows 11-20 into an "Other Flows" category
- Adds comprehensive documentation explaining the top talkers architecture and data flow
Reviewed Changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| server/tt_thread.c | Moves flow count calculation earlier and adds explanatory comments |
| messages/include/jt_msg_toptalk.h | Increases MAX_FLOWS to 20 and PROTO_LEN to 6, adds documentation comment |
| html5-client/src/js/jittertrap-core.js | Removes artificial 10-flow limit to use all available flows |
| html5-client/src/js/jittertrap-chart-toptalk.js | Implements flow aggregation logic and "Other" flow visualization |
| docs/top-talkers.md | Adds comprehensive architecture documentation |
| deps/toptalk/intervals.c | Minor comment improvements and code reorganization |
| }; | ||
|
|
||
| const processAndAggregateChartData = function(incomingData) { | ||
| const LEGEND_DISPLAY_LIMIT = 10; |
There was a problem hiding this comment.
The magic number 10 should be defined as a named constant at the module level to make it configurable and avoid duplication with the backend's expectations.
Suggested change
| const LEGEND_DISPLAY_LIMIT = 10; |
| const remainingFlows = incomingData.slice(LEGEND_DISPLAY_LIMIT); | ||
|
|
||
| const otherFlow = { | ||
| fkey: 'other', |
There was a problem hiding this comment.
The string 'other' is used as a magic value in multiple places (lines 34, 260, 397). Consider defining it as a named constant to prevent inconsistencies.
Suggested change
| fkey: 'other', | |
| fkey: OTHER_FLOW_KEY, |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.