Abstracted repetitive funcs into utility

app/assets/javascripts/ide/components/ide.vue

@@ -25,46 +25,24 @@ import ErrorMessage from './error_message.vue';
 import CommitEditorHeader from './commit_sidebar/editor_header.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 
-const markTreePerformance = () => {
-  performanceMarkAndMeasure({
-    mark: WEBIDE_MARK_TREE_FINISH,
-    measures: [
-      {
-        name: WEBIDE_MEASURE_TREE_FROM_REQUEST,
-        start: undefined,
-        end: WEBIDE_MARK_TREE_FINISH,
-      },
-    ],
-  });
-};
-const markEditorLoadPerformance = () => {
-  performanceMarkAndMeasure({
-    mark: WEBIDE_MARK_FILE_FINISH,
-    measures: [
-      {
-        name: WEBIDE_MEASURE_FILE_FROM_REQUEST,
-        start: undefined,
-        end: WEBIDE_MARK_FILE_FINISH,
-      },
-    ],
-  });
-};
-const markEditorInteractionPerformance = () => {
-  performanceMarkAndMeasure({
-    mark: WEBIDE_MARK_FILE_FINISH,
-    measures: [
-      {
-        name: WEBIDE_MEASURE_FILE_AFTER_INTERACTION,
-        start: WEBIDE_MARK_FILE_CLICKED,
-        end: WEBIDE_MARK_FILE_FINISH,
-      },
-    ],
-  });
-};
+import { measurePerformance } from '../utils';
 
-eventHub.$on(WEBIDE_MEASURE_TREE_FROM_REQUEST, markTreePerformance);
-eventHub.$on(WEBIDE_MEASURE_FILE_FROM_REQUEST, markEditorLoadPerformance);
-eventHub.$on(WEBIDE_MEASURE_FILE_AFTER_INTERACTION, markEditorInteractionPerformance);
+eventHub.$on(
+  WEBIDE_MEASURE_TREE_FROM_REQUEST,
+  measurePerformance.bind(WEBIDE_MARK_TREE_FINISH, WEBIDE_MEASURE_TREE_FROM_REQUEST),
+);
+eventHub.$on(
+  WEBIDE_MEASURE_FILE_FROM_REQUEST,
+  measurePerformance.bind(WEBIDE_MARK_FILE_FINISH, WEBIDE_MEASURE_FILE_FROM_REQUEST),
+);
+eventHub.$on(
+  WEBIDE_MEASURE_FILE_AFTER_INTERACTION,
+  measurePerformance.bind(
+    WEBIDE_MARK_FILE_FINISH,
+    WEBIDE_MEASURE_FILE_AFTER_INTERACTION,
+    WEBIDE_MARK_FILE_CLICKED,
+  ),
+);
 
 export default {
   components: {

app/assets/javascripts/ide/utils.js

 import { languages } from 'monaco-editor';
 import { flatten, isString } from 'lodash';
 import { SIDE_LEFT, SIDE_RIGHT } from './constants';
+import { performanceMarkAndMeasure } from '~/performance_utils';
 
 const toLowerCase = x => x.toLowerCase();
 
@@ -137,3 +138,21 @@ export function readFileAsDataURL(file) {
 export function getFileEOL(content = '') {
   return content.includes('\r\n') ? 'CRLF' : 'LF';
 }
+
+export const measurePerformance = (
+  mark,
+  measureName,
+  measureStart = undefined,
+  measureEnd = mark,
+) => {
+  performanceMarkAndMeasure({
+    mark,
+    measures: [
+      {
+        name: measureName,
+        start: measureStart,
+        end: measureEnd,
+      },
+    ],
+  });
+};