Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Time-to-first-frame metrics benchmarking and timeline chart #286

Merged
merged 17 commits into from
Dec 21, 2023
Merged

Time-to-first-frame metrics benchmarking and timeline chart #286

Show file tree
Hide file tree
Changes from 12 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
2bc53b0
data channel benchmarking message
niyatim23 Oct 16, 2023
d092b3f
additional logs
niyatim23 Oct 26, 2023
e47e9fe
granularity in time-to-first-frame
niyatim23 Oct 30, 2023
566028e
master and viewer metrics timeline chart
niyatim23 Nov 8, 2023
f36a203
signaling metrics viewer + master breakdown
niyatim23 Nov 9, 2023
b2a9c45
color coded, dynamic height adjustment, dynamic dataTable row addition
niyatim23 Nov 10, 2023
714a97f
connectAsViewer, enable non-json messages, enable viewing them in mes…
niyatim23 Nov 14, 2023
2deec4e
set timelineChartTestLength to 20
niyatim23 Nov 14, 2023
6d85b1a
cleanup 1
niyatim23 Nov 14, 2023
2ee30d6
pr cleanup as per comments
niyatim23 Nov 20, 2023
0eb2c00
adding a comment
niyatim23 Nov 20, 2023
b2e97de
readme update
niyatim23 Nov 20, 2023
55b1810
rename timestamp
niyatim23 Dec 8, 2023
05113cc
update the readme
niyatim23 Dec 18, 2023
a943e90
rename timestamps
niyatim23 Dec 18, 2023
660fe03
decouple from dqp
niyatim23 Dec 20, 2023
5a146f1
rename
niyatim23 Dec 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -369,6 +369,15 @@ An enum with the following values:
* `MASTER`
* `VIEWER`

## Analysis

<details>
<summary>Metrics</summary>

The DQP Metrics can be enabled in the sample application by checking a box before starting the viewer. This helps get a detailed breakdown of time-to-first-frame and all the processes and API calls on master and the viewer both. This is intended to be used with the KVS WebRTC C SDK running as the master and the JS SDK as the viewer. The WebRTC C SDK needs to be built with `cmake .. -DENABLE_SENDING_METRICS_TO_VIEWER=ON`. The master sends peer, ice-agent, signaling and data-channel metrics to the viewer which are plotted ~ 20 seconds after the viewer is started. Since the timeline plot is intended to understand the time-to-first-frame, the sample web page needs to be refreshed and the master needs to be restarted if a new / updated plot is needed.

</details>
niyatim23 marked this conversation as resolved.
Show resolved Hide resolved

## Compatibility

The SDK is supported in the following browsers / environments:
Expand Down
4 changes: 1 addition & 3 deletions examples/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -222,9 +222,7 @@ $('#viewer-button').click(async () => {

printFormValues(formValues);

startViewer(localView, remoteView, formValues, onStatsReport, event => {
remoteMessage.append(`${event.data}\n`);
});
startViewer(localView, remoteView, formValues, onStatsReport, remoteMessage);
});

$('#stop-viewer-button').click(onStop);
Expand Down
4 changes: 4 additions & 0 deletions examples/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
<script src="https://unpkg.com/@ungap/url-search-params"></script>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.2.1/dist/chart.umd.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<link rel="icon" type="image/png" href="favicon.ico">
</head>
<body>
Expand Down Expand Up @@ -352,6 +353,9 @@ <h3 id="dqpmetrics-header">DQP Test Metrics (from Master)</h3>
</div>
</div>
</div>
<div class="row">
<div id="timeline-chart" style="width:100%;height:0px"></div>
</div>
<h3 id="live-stats-header">Live Stats (from Master)</h3>
<div class="card bg-light mb-3">
<div id="webrtc-live-stats"></div>
Expand Down
Loading
Loading