diff --git a/components/lenses/ResponseBodyRenderer.vue b/components/lenses/ResponseBodyRenderer.vue
index 176fcfb0..4c085737 100644
--- a/components/lenses/ResponseBodyRenderer.vue
+++ b/components/lenses/ResponseBodyRenderer.vue
@@ -22,19 +22,14 @@
 </template>
 
 <script>
-import getSuitableLenses from "~/helpers/lenses/lenses"
+import { getSuitableLenses, getLensRenderers } from "~/helpers/lenses/lenses"
 
 export default {
   components: {
     tabs: () => import("../ui/tabs"),
     tab: () => import("../ui/tab"),
     // Lens Renderers
-    raw: () => import("./renderers/RawLensRenderer"),
-    json: () => import("./renderers/JSONLensRenderer"),
-    imageres: () => import("./renderers/ImageLensRenderer"),
-    htmlres: () => import("./renderers/HTMLLensRenderer"),
-    xmlres: () => import("./renderers/XMLLensRenderer"),
-    headers: () => import("./headers"),
+    ...getLensRenderers(),
   },
   props: {
     response: {},
diff --git a/helpers/lenses/htmlLens.js b/helpers/lenses/htmlLens.js
index 369efb61..5a8e3244 100644
--- a/helpers/lenses/htmlLens.js
+++ b/helpers/lenses/htmlLens.js
@@ -2,6 +2,7 @@ const htmlLens = {
   lensName: "HTML",
   supportedContentTypes: ["text/html"],
   renderer: "htmlres",
+  rendererImport: () => import("~/components/lenses/renderers/HTMLLensRenderer"),
 }
 
 export default htmlLens
diff --git a/helpers/lenses/imageLens.js b/helpers/lenses/imageLens.js
index 3bcb0582..1153822a 100644
--- a/helpers/lenses/imageLens.js
+++ b/helpers/lenses/imageLens.js
@@ -10,6 +10,7 @@ const imageLens = {
     "image/vnd.microsoft.icon",
   ],
   renderer: "imageres",
+  rendererImport: () => import("~/components/lenses/renderers/ImageLensRenderer"),
 }
 
 export default imageLens
diff --git a/helpers/lenses/jsonLens.js b/helpers/lenses/jsonLens.js
index 9ecb154f..5c337c1a 100644
--- a/helpers/lenses/jsonLens.js
+++ b/helpers/lenses/jsonLens.js
@@ -2,6 +2,7 @@ const jsonLens = {
   lensName: "JSON",
   supportedContentTypes: ["application/json", "application/hal+json", "application/vnd.api+json"],
   renderer: "json",
+  rendererImport: () => import("~/components/lenses/renderers/JSONLensRenderer"),
 }
 
 export default jsonLens
diff --git a/helpers/lenses/lenses.js b/helpers/lenses/lenses.js
index f33855ee..6423bcf1 100644
--- a/helpers/lenses/lenses.js
+++ b/helpers/lenses/lenses.js
@@ -6,7 +6,7 @@ import xmlLens from "./xmlLens"
 
 const lenses = [jsonLens, imageLens, htmlLens, xmlLens, rawLens]
 
-function getSuitableLenses(response) {
+export function getSuitableLenses(response) {
   const result = []
 
   if (response && response.headers && response.headers["content-type"]) {
@@ -28,4 +28,10 @@ function getSuitableLenses(response) {
   return result
 }
 
-export default getSuitableLenses
+export function getLensRenderers() {
+  const response = {}
+  for (const lens of lenses) {
+    response[lens.renderer] = lens.rendererImport
+  }
+  return response
+}
diff --git a/helpers/lenses/rawLens.js b/helpers/lenses/rawLens.js
index 8ccb35ba..2bb9635d 100644
--- a/helpers/lenses/rawLens.js
+++ b/helpers/lenses/rawLens.js
@@ -2,6 +2,7 @@ const rawLens = {
   lensName: "Raw",
   supportedContentTypes: null,
   renderer: "raw",
+  rendererImport: () => import("~/components/lenses/renderers/RawLensRenderer"),
 }
 
 export default rawLens
diff --git a/helpers/lenses/xmlLens.js b/helpers/lenses/xmlLens.js
index 4c415219..eb0b5a60 100644
--- a/helpers/lenses/xmlLens.js
+++ b/helpers/lenses/xmlLens.js
@@ -1,7 +1,8 @@
-const htmlLens = {
+const xmlLens = {
   lensName: "XML",
   supportedContentTypes: ["application/xml", "image/svg+xml", "text/xml", "application/rss+xml"],
   renderer: "xmlres",
+  rendererImport: () => import("~/components/lenses/renderers/XMLLensRenderer"),
 }
 
-export default htmlLens
+export default xmlLens