Merge branch '227139-remove-performance_bar-js-from-main-js' into 'master'

Remove performance_bar JS from main.js

Closes #227139

See merge request gitlab-org/gitlab!41741

app/assets/javascripts/main.js

@@ -31,7 +31,6 @@ import initLogoAnimation from './logo';
 import initFrequentItemDropdowns from './frequent_items';
 import initBreadcrumbs from './breadcrumb';
 import initUsagePingConsent from './usage_ping_consent';
-import initPerformanceBar from './performance_bar';
 import initSearchAutocomplete from './search_autocomplete';
 import GlFieldErrors from './gl_field_errors';
 import initUserPopovers from './user_popovers';
@@ -164,8 +163,6 @@ document.addEventListener('DOMContentLoaded', () => {
   const $document = $(document);
   const bootstrapBreakpoint = bp.getBreakpointSize();
 
-  if (document.querySelector('#js-peek')) initPerformanceBar({ container: '#js-peek' });
-
   initUserTracking();
   initLayoutNav();
   initAlertHandler();

app/assets/javascripts/performance_bar/index.js

@@ -5,7 +5,7 @@ import axios from '~/lib/utils/axios_utils';
 import PerformanceBarService from './services/performance_bar_service';
 import PerformanceBarStore from './stores/performance_bar_store';
 
-export default ({ container }) =>
+const initPerformanceBar = ({ container }) =>
   new Vue({
     el: container,
     components: {
@@ -118,3 +118,9 @@ export default ({ container }) =>
       });
     },
   });
+
+document.addEventListener('DOMContentLoaded', () => {
+  initPerformanceBar({ container: '#js-peek' });
+});
+
+export default initPerformanceBar;

app/views/layouts/_head.html.haml

@@ -70,6 +70,7 @@
     = yield :page_specific_javascripts
 
   = webpack_controller_bundle_tags
+  = webpack_bundle_tag 'performance_bar' if performance_bar_enabled?
   = webpack_bundle_tag "chrome_84_icon_fix" if browser.chrome?([">=84", "<84.0.4147.125"]) || browser.edge?([">=84", "<84.0.522.59"])
 
   = yield :project_javascripts

config/webpack.config.js

@@ -79,6 +79,7 @@ function generateEntries() {
   const manualEntries = {
     default: defaultEntries,
     sentry: './sentry/index.js',
+    performance_bar: './performance_bar/index.js',
     chrome_84_icon_fix: './lib/chrome_84_icon_fix.js',
   };