5d0e0137d5
Summary: Current metrics are deltas from an initial set timestamp. This works but is limiting or affecting the overall accuracy of them. The aim of this task is to replace the deltas with actual measurements for the operations. This way we can add/remove operations in between which will not create any impact of them. Reviewed By: LukeDefeo Differential Revision: D44026823 fbshipit-source-id: fd7d62c4eab86bab8239b44beecd5c133f6d11c7
95 lines
2.1 KiB
TypeScript
95 lines
2.1 KiB
TypeScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
*/
|
|
|
|
import {PerformanceStatsEvent} from '../types';
|
|
import React from 'react';
|
|
import {DataSource, DataTable, DataTableColumn} from 'flipper-plugin';
|
|
|
|
export function PerfStats(props: {
|
|
events: DataSource<PerformanceStatsEvent, number>;
|
|
}) {
|
|
return (
|
|
<DataTable<PerformanceStatsEvent>
|
|
dataSource={props.events}
|
|
columns={columns}
|
|
/>
|
|
);
|
|
}
|
|
|
|
function formatDiff(ms: number): string {
|
|
return `${ms.toFixed(0)}ms`;
|
|
}
|
|
|
|
const columns: DataTableColumn<PerformanceStatsEvent>[] = [
|
|
{
|
|
key: 'txId',
|
|
title: 'TXID',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return row.txId;
|
|
},
|
|
},
|
|
{
|
|
key: 'observerType',
|
|
title: 'Type',
|
|
},
|
|
{
|
|
key: 'nodesCount',
|
|
title: 'Total nodes',
|
|
},
|
|
{
|
|
key: 'start',
|
|
title: 'Start',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return new Date(row.start).toISOString();
|
|
},
|
|
},
|
|
{
|
|
key: 'traversalMS',
|
|
title: 'Traversal time (Main thread)',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.traversalMS);
|
|
},
|
|
},
|
|
{
|
|
key: 'snapshotMS',
|
|
title: 'Snapshot time (Main thread)',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.snapshotMS);
|
|
},
|
|
},
|
|
{
|
|
key: 'queuingMS',
|
|
title: 'Queuing time',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.queuingMS);
|
|
},
|
|
},
|
|
{
|
|
key: 'deferredComputationMS',
|
|
title: 'Deferred processing time',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.deferredComputationMS);
|
|
},
|
|
},
|
|
{
|
|
key: 'serializationMS',
|
|
title: 'Serialization time',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.serializationMS);
|
|
},
|
|
},
|
|
{
|
|
key: 'socketMS',
|
|
title: 'Socket send time',
|
|
onRender: (row: PerformanceStatsEvent) => {
|
|
return formatDiff(row.socketMS);
|
|
},
|
|
},
|
|
];
|