WIP on performances

src/routes/index.svelte

@@ -32,6 +32,8 @@
         pageReady
     } from 'utils/store'
     import { charsToSpan, smoothScroll } from 'utils/functions'
+    // Dependencies
+    import ScrollOut from 'scroll-out'
     // Components
     import Button from 'atoms/Button'
     import IconGlobeSmall from 'atoms/IconGlobeSmall'
@@ -49,6 +51,10 @@
     // Props and Variables
     export let photos = ''
     const { page } = stores()
+    // let Carousel
+    // let Fullscreen
+    // let InteractiveGlobe
+    // let Locations
 
     // Reset current location if existing
     currentLocation.set()
@@ -58,7 +64,13 @@
     /*
     ** Run code when mounted
     */
-    onMount(() => {
+    onMount(async () => {
+        // Load components
+        // await import('organisms/Carousel').then(module => Carousel = module.default)
+        // await import('organisms/Fullscreen').then(module => Fullscreen = module.default)
+        // await import('molecules/InteractiveGlobe').then(module => InteractiveGlobe = module.default)
+        // await import('organisms/Locations').then(module => Locations = module.default)
+
         // Page is loaded
         pageReady.set(true)
     })
@@ -97,7 +109,9 @@
 
         <div id="intro-carousel">
             <Carousel {photos} locationUrl={true} />
+            <!-- <svelte:component this={Carousel} {photos} locationUrl={true} /> -->
             <Fullscreen />
+            <!-- <svelte:component this={Fullscreen} /> -->
         </div>
     </section>
 
@@ -113,6 +127,7 @@
         </div>
 
         <InteractiveGlobe />
+        <!-- <svelte:component this={InteractiveGlobe} /> -->
 
         <div class="anim-mask anim-title">
             <h1 class="title-massive title-parallax" id="title-world" aria-label="World">
@@ -121,6 +136,7 @@
         </div>
 
         <Locations />
+        <!-- <svelte:component this={Locations} /> -->
     </section>
 
     <Footer />