Track duration for initial video fetch time
this may help identify degraded services and poor user experience.
This commit is contained in:
parent
dc1be2791f
commit
d47b6eae0c
2 changed files with 14 additions and 0 deletions
|
@ -199,6 +199,12 @@ const analytics: Analytics = {
|
|||
Lbryio.call('feedback', 'search', { query, vote });
|
||||
}
|
||||
},
|
||||
|
||||
videoFetchDuration: (source, duration) => {
|
||||
sendPromMetric('time_to_fetch', duration);
|
||||
sendMatomoEvent('Media', 'TimeToFetch', source, duration);
|
||||
},
|
||||
|
||||
videoStartEvent: (claimId, duration) => {
|
||||
sendPromMetric('time_to_start', duration);
|
||||
sendMatomoEvent('Media', 'TimeToStart', claimId, duration);
|
||||
|
|
|
@ -11,6 +11,7 @@ import './plugins/videojs-mobile-ui/plugin';
|
|||
import hlsQualitySelector from './plugins/videojs-hls-quality-selector/plugin';
|
||||
import qualityLevels from 'videojs-contrib-quality-levels';
|
||||
import isUserTyping from 'util/detect-typing';
|
||||
import analytics from 'analytics';
|
||||
|
||||
const isDev = process.env.NODE_ENV !== 'production';
|
||||
|
||||
|
@ -479,8 +480,15 @@ export default React.memo<Props>(function VideoJs(props: Props) {
|
|||
|
||||
// Update video player and reload when source URL changes
|
||||
useEffect(() => {
|
||||
const fetchStartedAt = performance.now();
|
||||
// For some reason the video player is responsible for detecting content type this way
|
||||
fetch(source, { method: 'HEAD', cache: 'no-store' }).then((response) => {
|
||||
const deltaFetch = performance.now() - fetchStartedAt;
|
||||
console.log(`Prefetch took: ${deltaFetch.toFixed(3)}ms`);
|
||||
|
||||
// Send fetch duration analytic event (in ms)
|
||||
analytics.videoFetchDuration(source, deltaFetch);
|
||||
|
||||
const player = playerRef.current;
|
||||
|
||||
if (!player) {
|
||||
|
|
Loading…
Reference in a new issue