[PR] [FLINK-Web][Web Dashboard] Add Top N Metrics Dashboard feature [flink]

["featzhang (via GitHub)" <gi...@apache.org>]

featzhang opened a new pull request, #27771:
URL: https://github.com/apache/flink/pull/27771

   ## Purpose
   
   This PR adds a Top N Metrics Dashboard to the Flink Web UI, providing operators with enhanced visibility into resource-intensive components in their Flink jobs. The dashboard displays three critical metric categories in real-time:
   
   1. **Top N CPU Consumers** - Tasks consuming the most CPU resources
   2. **Top N Backpressure Operators** - Operators experiencing the highest backpressure ratios
   3. **Top N GC Intensive Tasks** - Tasks with the highest garbage collection overhead
   
   This feature enables faster identification of performance bottlenecks and helps operators optimize job execution by quickly locating problematic components.
   
   ## Change log
   
   **Backend Changes:**
   - Added `TopNMetricsHandler.java` - REST API handler for Top N metrics aggregation
   - Added `TopNMetricsHeaders.java` - REST endpoint definition and response type specification
   - Added `TopNMetricsMessageParameters.java` - Request parameter definitions
   - Added `TopNMetricsResponseBody.java` - Response body structure with three inner classes
   
   **Frontend Changes:**
   - Added `TopNMetricsService.ts` - Service to fetch Top N metrics from backend
   - Added `topn-metrics.ts` - TypeScript interface definitions
   - Added `TopNMetricsComponent` - Angular component with HTML template and Less styles
   - Added `OverviewDemoComponent` - Demo page showcasing the feature
   
   **New REST API:**
   - `GET /jobs/:jobid/metrics/top-n` - Returns Top N metrics for a specified job
   
   ## Verifying
   
   1. Build the Flink project: `mvn clean install -DskipTests`
   2. Build the web dashboard: `cd flink-runtime-web/web-dashboard && npm install && npm run build`
   3. Start a local Flink cluster with a sample job
   4. Access the demo page at `/overview-demo` to see the Top N Metrics Dashboard
   5. For integration testing, navigate to `/jobs/{jobId}/metrics/top-n` to verify API returns valid data
   
   ## Impact
   
   **Scope:**
   - New feature addition to the Flink Web UI
   - Does not modify existing API behavior
   - Only adds a new REST endpoint and frontend components
   
   **Performance:**
   - Minimal overhead as metrics are already being collected and cached
   - No impact on job execution performance
   
   **Compatibility:**
   - Fully backward compatible
   - Optional feature
   
   ## Documentation
   
   Documentation updates needed for:
   - Web UI documentation
   - REST API reference
   - Monitoring and debugging guides


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: issues-unsubscribe@flink.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] [FLINK-Web][Web Dashboard] Add Top N Metrics Dashboard feature [flink]

["featzhang (via GitHub)" <gi...@apache.org>]

featzhang closed pull request #27771: [FLINK-Web][Web Dashboard] Add Top N Metrics Dashboard feature
URL: https://github.com/apache/flink/pull/27771


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: issues-unsubscribe@flink.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] [FLINK-Web][Web Dashboard] Add Top N Metrics Dashboard feature [flink]

["featzhang (via GitHub)" <gi...@apache.org>]

featzhang commented on PR #27771:
URL: https://github.com/apache/flink/pull/27771#issuecomment-4062587654

   Closing this PR due to fundamental architectural issues found during CI analysis.
   
   **Issues Identified:**
   1. Access to private members (MetricStore.JobMetricStore, TaskMetricStore.subtasks)
   2. Non-existent API (JobMetricStoreSnapshot.get())
   3. Incorrect interface usage (MessageHeaders instead of RuntimeMessageHeaders)
   4. Wrong class references (HttpMethod instead of HttpMethodWrapper)
   5. Incorrect Handler inheritance structure
   
   **Root Cause:**
   The implementation does not follow the standard Flink REST API architecture pattern. A complete redesign is required.
   
   **Next Steps:**
   - Research existing metrics handler implementations (e.g., JobManagerOperatorMetricsHandler)
   - Redesign the architecture following Flink standards
   - Reimplement with proper interfaces and access patterns


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: issues-unsubscribe@flink.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

Re: [PR] [FLINK-Web][Web Dashboard] Add Top N Metrics Dashboard feature [flink]

["flinkbot (via GitHub)" <gi...@apache.org>]

flinkbot commented on PR #27771:
URL: https://github.com/apache/flink/pull/27771#issuecomment-4062211058

   <!--
   Meta data
   {
     "version" : 1,
     "metaDataEntries" : [ {
       "hash" : "043d1eba9b8aa3b5425f6efa293d51bf62bf6999",
       "status" : "UNKNOWN",
       "url" : "TBD",
       "triggerID" : "043d1eba9b8aa3b5425f6efa293d51bf62bf6999",
       "triggerType" : "PUSH"
     } ]
   }-->
   ## CI report:
   
   * 043d1eba9b8aa3b5425f6efa293d51bf62bf6999 UNKNOWN
   
   <details>
   <summary>Bot commands</summary>
     The @flinkbot bot supports the following commands:
   
    - `@flinkbot run azure` re-run the last Azure build
   </details>


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: issues-unsubscribe@flink.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org