attachment optimization

src/components/attachment/attachment.js

@@ -1,7 +1,7 @@
 import { mapState } from 'pinia'
+import { defineAsyncComponent } from 'vue'
 
 import nsfwImage from '../../assets/nsfw.png'
-import Flash from '../flash/flash.vue'
 import Popover from '../popover/popover.vue'
 import StillImage from '../still-image/still-image.vue'
 import VideoAttachment from '../video_attachment/video_attachment.vue'
@@ -69,9 +69,13 @@ const Attachment = {
     }
   },
   components: {
-    Flash,
+    Flash: defineAsyncComponent(
+      () => import( 'src/components/flash/flash.vue'),
+    ),
     StillImage,
-    VideoAttachment,
+    VideoAttachment: defineAsyncComponent(
+      () => import( 'src/components/video_attachment/video_attachment.vue'),
+    ),
     Popover,
   },
   computed: {

src/components/media_modal/media_modal.js

@@ -3,6 +3,9 @@ import GestureService from '../../services/gesture_service/gesture_service'
 import { useMediaViewerStore } from 'src/stores/media_viewer.js'
 import { defineAsyncComponent } from 'vue'
 
+import Modal from 'src/components/modal/modal.vue'
+import StillImage from 'src/components/still-image/still-image.vue'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faChevronLeft,
@@ -15,9 +18,7 @@ library.add(faChevronLeft, faChevronRight, faCircleNotch, faTimes)
 
 const MediaModal = {
   components: {
-    StillImage: defineAsyncComponent(
+    StillImage,
-      () => import( 'src/components/still-image/still-image.vue'),
-    ),
     VideoAttachment: defineAsyncComponent(
       () => import( 'src/components/video_attachment/video_attachment.vue'),
     ),
@@ -27,9 +28,7 @@ const MediaModal = {
     SwipeClick: defineAsyncComponent(
       () => import( 'src/components/swipe_click/swipe_click.vue'),
     ),
-    Modal: defineAsyncComponent(
+    Modal,
-      () => import( 'src/components/modal/modal.vue'),
-    ),
     Flash: defineAsyncComponent(
       () => import( 'src/components/flash/flash.vue'),
     ),