diff --git a/src/components/entity/feed-entry.vue b/src/components/entity/feed-entry.vue
index 26f9ce0ae..beea7176e 100644
--- a/src/components/entity/feed-entry.vue
+++ b/src/components/entity/feed-entry.vue
@@ -183,8 +183,9 @@ const deletedSubmission = (key) => t(key, { id: props.submission.instanceId });
 
 // entity.create, entity.update.version
 const versionAnchor = (v) => `#v${v}`;
+const config = inject('config');
 const showBranchData = () => {
-  emit('branch-data', props.entityVersion.version);
+  if (config.devTools) emit('branch-data', props.entityVersion.version);
 };
 </script>
 
diff --git a/src/components/entity/show.vue b/src/components/entity/show.vue
index 30d51e214..81ad2ae4a 100644
--- a/src/components/entity/show.vue
+++ b/src/components/entity/show.vue
@@ -37,19 +37,19 @@ except according to the terms contained in the LICENSE file.
       :label="entity.dataExists ? entity.currentVersion.label : ''"
       :awaiting-response="awaitingResponse" @hide="deleteModal.hide()"
       @delete="requestDelete"/>
-    <entity-branch-data v-bind="branchData" @hide="branchData.hide()"/>
+    <entity-branch-data v-if="config.devTools" v-bind="branchData"
+      @hide="branchData.hide()"/>
   </div>
 </template>
 
 <script setup>
-import { computed, inject, provide } from 'vue';
+import { computed, defineAsyncComponent, inject, provide } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 
 import Breadcrumbs from '../breadcrumbs.vue';
 import EntityActivity from './activity.vue';
 import EntityBasicDetails from './basic-details.vue';
-import EntityBranchData from './branch-data.vue';
 import EntityData from './data.vue';
 import EntityDelete from './delete.vue';
 import EntityUpdate from './update.vue';
@@ -62,6 +62,7 @@ import useEntityVersions from '../../request-data/entity-versions';
 import useRequest from '../../composables/request';
 import useRoutes from '../../composables/routes';
 import { apiPaths } from '../../util/request';
+import { loadAsync } from '../../util/load-async';
 import { modalData, setDocumentTitle } from '../../util/reactivity';
 import { noop } from '../../util/util';
 import { useRequestData } from '../../request-data';
@@ -121,7 +122,7 @@ fetchActivityData();
 setDocumentTitle(() => [entity.dataExists ? entity.currentVersion.label : null]);
 
 const updateModal = modalData();
-const { i18n, alert } = inject('container');
+const { i18n, alert, config } = inject('container');
 const afterUpdate = (updatedEntity) => {
   fetchActivityData();
   updateModal.hide();
@@ -154,7 +155,8 @@ const requestDelete = () => {
     .catch(noop);
 };
 
-const branchData = modalData();
+const EntityBranchData = defineAsyncComponent(loadAsync('EntityBranchData'));
+const branchData = modalData('EntityBranchData');
 
 const breadcrumbLinks = computed(() => [
   { text: project.nameWithArchived, path: projectPath() },
diff --git a/src/config.js b/src/config.js
index 260450e1a..12570fc45 100644
--- a/src/config.js
+++ b/src/config.js
@@ -22,5 +22,7 @@ export default {
   // VUE_APP_OIDC_ENABLED is not set in production. It can be set during local
   // development to facilitate work on SSO.
   oidcEnabled: process.env.VUE_APP_OIDC_ENABLED === 'true',
-  showsFeedbackButton: false
+  showsFeedbackButton: false,
+  // `true` to show additional buttons to facilitate development and testing.
+  devTools: false
 };
diff --git a/src/util/load-async.js b/src/util/load-async.js
index 5933586b7..3921d4dad 100644
--- a/src/util/load-async.js
+++ b/src/util/load-async.js
@@ -83,6 +83,10 @@ const loaders = new Map()
     /* webpackChunkName: "component-download" */
     '../components/download.vue'
   )))
+  .set('EntityBranchData', loader(() => import(
+    /* webpackChunkName: "component-entity-branch-data" */
+    '../components/entity/branch-data.vue'
+  )))
   .set('EntityShow', loader(() => import(
     /* webpackChunkName: "component-entity-show" */
     '../components/entity/show.vue'