You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
flink/flink-runtime-web
Yadong Xie 8a95253e61
[FLINK-14270][web] Support to display more metrics at once (#10689)
5 years ago
..
src [FLINK-15628][rest] Create webSumissionHandlers List with default capacity 5 years ago
web-dashboard [FLINK-14270][web] Support to display more metrics at once (#10689) 5 years ago
README.md [FLINK-10706][web]: Rework Flink Web Dashboard 6 years ago
pom.xml [FLINK-15651][tests] Refactor JarHandlerTest 5 years ago

README.md

Apache Flink Web Dashboard

The web dashboard is work in progress towards the new Flink runtime monitor. In particular, it will provide the following missing features of the current web dashboard:

  • Live progress monitoring (via live accumulators)
  • A graph view of the program, as it is executed.
  • A REST style API to access the status of individual jobs.
  • A more modular design

The dashboard listens at http://localhost:8081.

The new web dashboard is work in progress. It starts an HTTP server (by default at port 8081) that serves the new web pages and additional background requests.

Server Backend

The server side of the dashboard is implemented using Netty with Netty Router for REST paths. The framework has very lightweight dependencies.

The code is regular Java code built via Maven. To add additional request handlers, follow the example of the org.apache.flink.runtime.webmonitor.handlers.JobSummaryHandler.

Dashboard Frontend

The web dashboard is implemented using Angular. The dashboard build infrastructure uses node.js.

Preparing the Build Environment

Depending on your version of Linux, Windows or MacOS, you may need to manually install node.js

Ubuntu Linux

Install node.js by following these instructions.

Verify that the installed version is at least 10.9.0, via npm -version.

MacOS

First install brew by following these instructions.

Install node.js via:

brew install node

Building

The build process downloads all requires libraries via the node.js package management tool (npm) The final build tool is @angular/cli.

cd flink-runtime-web/web-dashboard
npm install
npm run build

The dashboard code is under /src. The result of the build process is under /web.

Developing

When developing the dashboard, every change needs to recompile the files and update the server:

cd flink-runtime-web/web-dashboard
npm run build
cd ../../flink-dist
mvn -DskipTests clean package

To simplify continuous development, one can use a standalone proxy server, together with automatic re-compilation:

  1. Start the proxy server via npm run proxy (You can modify the proxy target in the proxy.conf.json, the default proxy target is localhost:8081)
  2. Access the dashboard at http://localhost:4200

CodeStyle & Lint

$ npm run lint

Dependency