[UI/UX] As a developer, I want to understand how Work and Transaction get included in a Block

[lukasimrich]

TODO

• [x] Kick off with Bruno, defining the problem to solve
• [x] Initial Slot saturation UI + feedback (Bruno, Teo) adjustments
• [ ] Review real data Initial Slot saturation UI charts, adjust designs
• [x] Kick off with Zura, UI to display work latencies
• [ ] Review real data, show data as histograms/line charts

As a developer striving to improve blockchain performance, I want a tool that helps me identify the reasons

• why sometimes more work is included in a block than required, or
• why a block is not fully filled with transactions, although having free slots and required work

The tool should allow me to see meaningful patterns in the recorded data such as

• the diff between available slots and included transactions -> to spot not optimally filled blocks
• the diff between required work and actual work -> to sport overfilled blocks with work
• detailed view to inspect per block basis to see the structure of included/discarded work and transactions

This will help me to make data-driven decisions to optimize blockchain performance.

Additional Requirements

• snark worker requested job
• snark worker received result (empty or some work).
• snark worker finished generating snark.
• snark worker submit snark start.
• snark worker submit snark end.
• Work included in the snark pool (not sure which node to query).

[lukasimrich]

WEEK - 6 -

The chart helps to spot anomalies across available data, you can click on the chart so you see only relevant records in the table, so you can easily find a suspicious block and inspect details about the structure of included/discarded work and transactions in the sidebar

Some specfics for the chart: the diff between available slots and included transactions -> to spot not optimally filled blocks the diff between required work and actual work This is the part that must help to see the big picture and identify anomalies, it should allow to filter the view to see only relevant data

Some details about the table view: detailed view to inspect per block basis to see the structure of included/discarded work and transactions This part must help to understand why something happened, it should allow to filter blocks to see only relevant range of blocks (based on the selection from the line chart big overview) all, canonical, orphaned blocks work/transactions that are not fully filled the displayed blocks must clearly communicate how saturated are with transactions and whether the required work was done properly or overly

[lukasimrich]

WEEK - 7 -

Work Latency Page

Main goals

• Answer the question of network saturation (saturated or not?)
• The time factor is essential, to understand when congestion happened
• Understand the relationship between times/kinds

Work Latency Traces Page

• there are live filters to show what and how many kinds we have in a selected time range/workers
• I tried to put the aggregated sum of latencies for each checkpoint, so you can see “saturation”
• I did it a naive way, but I believe there is a way to have a time serie of sum of latency for each checkpoint/second

Latency Distributions Page

• this a big overview, I used histograms on the left side to see the big picture
• to enable users to select a specific latency distribution to investigate further
• we already did these histograms in the past, should not be too much FE effort
• on the right side we have a table, each worker is listed separately and its data are displayed as quartiles + we display total success/failures (edited)