diff --git a/app/assets/javascripts/performance_bar/components/performance_bar_app.vue b/app/assets/javascripts/performance_bar/components/performance_bar_app.vue
index 48515cf785c8b93966fdea8d994f505509787ec2..2e95427603a3dd7d5e688c05f3bfdb3a512b23eb 100644
--- a/app/assets/javascripts/performance_bar/components/performance_bar_app.vue
+++ b/app/assets/javascripts/performance_bar/components/performance_bar_app.vue
@@ -5,6 +5,7 @@ import { glEmojiTag } from '~/emoji';
 import detailedMetric from './detailed_metric.vue';
 import requestSelector from './request_selector.vue';
 import simpleMetric from './simple_metric.vue';
+import { __ } from '~/locale';
 
 export default {
   components: {
@@ -35,10 +36,10 @@ export default {
     },
   },
   detailedMetrics: [
-    { metric: 'pg', header: 'SQL queries', details: 'queries', keys: ['sql'] },
+    { metric: 'pg', header: __('SQL queries'), details: 'queries', keys: ['sql'] },
     {
       metric: 'gitaly',
-      header: 'Gitaly calls',
+      header: __('Gitaly calls'),
       details: 'details',
       keys: ['feature', 'request'],
     },
@@ -99,7 +100,8 @@ export default {
           class="current-host"
           :class="{ canary: currentRequest.details.host.canary }"
         >
-          <span v-html="birdEmoji"></span> {{ currentRequest.details.host.hostname }}
+          <span v-html="birdEmoji"></span>
+          {{ currentRequest.details.host.hostname }}
         </span>
       </div>
       <detailed-metric
@@ -118,9 +120,9 @@ export default {
           data-toggle="modal"
           data-target="#modal-peek-line-profile"
         >
-          profile
+          {{ __('profile') }}
         </button>
-        <a v-else :href="profileUrl"> profile </a>
+        <a v-else :href="profileUrl">{{ __('profile') }}</a>
       </div>
       <simple-metric
         v-for="metric in $options.simpleMetrics"
@@ -139,7 +141,7 @@ export default {
         id="peek-view-trace"
         class="view"
       >
-        <a :href="currentRequest.details.tracing.tracing_url"> trace </a>
+        <a :href="currentRequest.details.tracing.tracing_url">{{ __('trace') }}</a>
       </div>
       <request-selector
         v-if="currentRequest"
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 9ea368816f987775d9c2ebc4e380294ea9c76225..9a81c8925a824aaa8245daf4fcc63576e1a06475 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -4808,6 +4808,9 @@ msgstr ""
 msgid "Gitaly Servers"
 msgstr ""
 
+msgid "Gitaly calls"
+msgstr ""
+
 msgid "Gitaly|Address"
 msgstr ""
 
@@ -8836,6 +8839,9 @@ msgstr ""
 msgid "Runs a number of housekeeping tasks within the current repository, such as compressing file revisions and removing unreachable objects."
 msgstr ""
 
+msgid "SQL queries"
+msgstr ""
+
 msgid "SSH Key"
 msgstr ""
 
@@ -12708,6 +12714,9 @@ msgstr ""
 msgid "processing"
 msgstr ""
 
+msgid "profile"
+msgstr ""
+
 msgid "project"
 msgstr ""
 
@@ -12782,6 +12791,9 @@ msgstr ""
 msgid "this document"
 msgstr ""
 
+msgid "trace"
+msgstr ""
+
 msgid "triggered"
 msgstr ""