Add performance instrumentation helpers to MR Diffs App

app/assets/javascripts/diffs/constants.js

@@ -98,3 +98,8 @@ export const RENAMED_DIFF_TRANSITIONS = {
 
 // MR Diffs known events
 export const EVT_EXPAND_ALL_FILES = 'mr:diffs:expandAllFiles';
+export const EVT_PERF_MARK_FILE_TREE_START = 'mr:diffs:perf:fileTreeStart';
+export const EVT_PERF_MARK_FILE_TREE_END = 'mr:diffs:perf:fileTreeEnd';
+export const EVT_PERF_MARK_DIFF_FILES_START = 'mr:diffs:perf:filesStart';
+export const EVT_PERF_MARK_FIRST_DIFF_FILE_SHOWN = 'mr:diffs:perf:firstFileShown';
+export const EVT_PERF_MARK_DIFF_FILES_END = 'mr:diffs:perf:filesEnd';

app/assets/javascripts/diffs/utils/performance.js

+import { performanceMarkAndMeasure } from '~/performance_utils';
+import {
+  MR_DIFFS_MARK_FILE_TREE_START,
+  MR_DIFFS_MARK_FILE_TREE_END,
+  MR_DIFFS_MARK_DIFF_FILES_START,
+  MR_DIFFS_MARK_FIRST_DIFF_FILE_SHOWN,
+  MR_DIFFS_MARK_DIFF_FILES_END,
+  MR_DIFFS_MEASURE_FILE_TREE_DONE,
+  MR_DIFFS_MEASURE_DIFF_FILES_DONE,
+} from '../../performance_constants';
+
+import eventHub from '../event_hub';
+import {
+  EVT_PERF_MARK_FILE_TREE_START,
+  EVT_PERF_MARK_FILE_TREE_END,
+  EVT_PERF_MARK_DIFF_FILES_START,
+  EVT_PERF_MARK_FIRST_DIFF_FILE_SHOWN,
+  EVT_PERF_MARK_DIFF_FILES_END,
+} from '../constants';
+
+function treeStart() {
+  performanceMarkAndMeasure({
+    mark: MR_DIFFS_MARK_FILE_TREE_START,
+  });
+}
+
+function treeEnd() {
+  performanceMarkAndMeasure({
+    mark: MR_DIFFS_MARK_FILE_TREE_END,
+    measures: [
+      {
+        name: MR_DIFFS_MEASURE_FILE_TREE_DONE,
+        start: MR_DIFFS_MARK_FILE_TREE_START,
+        end: MR_DIFFS_MARK_FILE_TREE_END,
+      },
+    ],
+  });
+}
+
+function filesStart() {
+  performanceMarkAndMeasure({
+    mark: MR_DIFFS_MARK_DIFF_FILES_START,
+  });
+}
+
+function filesEnd() {
+  performanceMarkAndMeasure({
+    mark: MR_DIFFS_MARK_DIFF_FILES_END,
+    measures: [
+      {
+        name: MR_DIFFS_MEASURE_DIFF_FILES_DONE,
+        start: MR_DIFFS_MARK_DIFF_FILES_START,
+        end: MR_DIFFS_MARK_DIFF_FILES_END,
+      },
+    ],
+  });
+}
+
+function firstFile() {
+  performanceMarkAndMeasure({
+    mark: MR_DIFFS_MARK_FIRST_DIFF_FILE_SHOWN,
+  });
+}
+
+export const diffsApp = {
+  instrument() {
+    eventHub.$on(EVT_PERF_MARK_FILE_TREE_START, treeStart);
+    eventHub.$on(EVT_PERF_MARK_FILE_TREE_END, treeEnd);
+    eventHub.$on(EVT_PERF_MARK_DIFF_FILES_START, filesStart);
+    eventHub.$on(EVT_PERF_MARK_DIFF_FILES_END, filesEnd);
+    eventHub.$on(EVT_PERF_MARK_FIRST_DIFF_FILE_SHOWN, firstFile);
+  },
+  deinstrument() {
+    eventHub.$off(EVT_PERF_MARK_FIRST_DIFF_FILE_SHOWN, firstFile);
+    eventHub.$off(EVT_PERF_MARK_DIFF_FILES_END, filesEnd);
+    eventHub.$off(EVT_PERF_MARK_DIFF_FILES_START, filesStart);
+    eventHub.$off(EVT_PERF_MARK_FILE_TREE_END, treeEnd);
+    eventHub.$off(EVT_PERF_MARK_FILE_TREE_START, treeStart);
+  },
+};

app/assets/javascripts/performance/constants.js

@@ -29,3 +29,17 @@ export const WEBIDE_MARK_FILE_FINISH = 'webide-file-finished';
 export const WEBIDE_MEASURE_TREE_FROM_REQUEST = 'webide-tree-loading-from-request';
 export const WEBIDE_MEASURE_FILE_FROM_REQUEST = 'webide-file-loading-from-request';
 export const WEBIDE_MEASURE_FILE_AFTER_INTERACTION = 'webide-file-loading-after-interaction';
+
+//
+// MR Diffs namespace
+
+// Marks
+export const MR_DIFFS_MARK_FILE_TREE_START = 'mr-diffs-mark-file-tree-start';
+export const MR_DIFFS_MARK_FILE_TREE_END = 'mr-diffs-mark-file-tree-end';
+export const MR_DIFFS_MARK_DIFF_FILES_START = 'mr-diffs-mark-diff-files-start';
+export const MR_DIFFS_MARK_FIRST_DIFF_FILE_SHOWN = 'mr-diffs-mark-first-diff-file-shown';
+export const MR_DIFFS_MARK_DIFF_FILES_END = 'mr-diffs-mark-diff-files-end';
+
+// Measures
+export const MR_DIFFS_MEASURE_FILE_TREE_DONE = 'mr-diffs-measure-file-tree-done';
+export const MR_DIFFS_MEASURE_DIFF_FILES_DONE = 'mr-diffs-measure-diff-files-done';