From d14fee177e963e559d9eede67391a15ca8ad87d2 Mon Sep 17 00:00:00 2001 From: Erlend Date: Mon, 8 Aug 2022 12:37:23 +0200 Subject: Updated README with information about trace visualizer --- client/js/app/README.md | 37 ++++++++++++++++++++++++++++++++++- client/js/app/img/JaegerExample.png | Bin 0 -> 24416 bytes client/js/app/img/TraceConverter.png | Bin 0 -> 14448 bytes client/js/app/img/result.png | Bin 0 -> 101286 bytes 4 files changed, 36 insertions(+), 1 deletion(-) create mode 100644 client/js/app/img/JaegerExample.png create mode 100644 client/js/app/img/TraceConverter.png create mode 100644 client/js/app/img/result.png (limited to 'client/js') diff --git a/client/js/app/README.md b/client/js/app/README.md index c3a9e2cac50..7e7aed1b2e1 100644 --- a/client/js/app/README.md +++ b/client/js/app/README.md @@ -2,7 +2,42 @@ # Vespa client -This app is work in progress +This app is work in progress. + +This client currently contains the **Query Builder** and the **Trace Visualizer**. + +# Query Builder + +The Query Builder is a tool for creating Vespa queries to send to a local backend. +The tool provides all of the options for query parameters from dropdowns. The input fields +provide hints to what is the expected type of value. + +# Trace Visualizer + +The Trace Visualizer is a tool for converting and visualizing traces from Vespa in a flame graph. +To use the visualizer, a [Jaeger](https://www.jaegertracing.io/) instance must be run locally with Docker. + + docker run -d --rm \ + -p 16685:16685 \ + -p 16686:16686 \ + -p 16687:16687 \ + -e SPAN_STORAGE_TYPE=memory \ + jaegertracing/jaeger-query:latest + +To use the visualizer you paste the Vespa trace into the text box and press the button to convert the trace +to a format supported by Jaeger and download it. +Only Vespa traces using _trace.timestampa=true_ **and** _traceLevel_ between 3 and 5 (inclusive) will work correctly. + +![Trace Converter](/img/TraceConverter.png) + +When downloading the trace a new tab with Jeager will open up. +Press the _JSON File_ button as shown in the image, and drag and drop the trace you just downloaded. + +![Jager Image](/img/JaegerExample.png) + +You can then click on the newly added trace and see it displayed as a flame graph. + +![Example Image](/img/result.png) # Client install and start diff --git a/client/js/app/img/JaegerExample.png b/client/js/app/img/JaegerExample.png new file mode 100644 index 00000000000..646123962ad Binary files /dev/null and b/client/js/app/img/JaegerExample.png differ diff --git a/client/js/app/img/TraceConverter.png b/client/js/app/img/TraceConverter.png new file mode 100644 index 00000000000..9d7146556a1 Binary files /dev/null and b/client/js/app/img/TraceConverter.png differ diff --git a/client/js/app/img/result.png b/client/js/app/img/result.png new file mode 100644 index 00000000000..6f17cc783bb Binary files /dev/null and b/client/js/app/img/result.png differ -- cgit v1.2.3