WIP on performances

src/molecules/InteractiveGlobe.svelte

@@ -22,34 +22,30 @@
     ** Run code when mounted
     */
     onMount(async () => {
-        // For browser only
-        if (process.browser) {
-            // Import libraries and code
-            let Globe
-            await import('globe').then(module => Globe = module.default)
+        // Import libraries and code
+        let InteractiveGlobe
+        await import('globe/index').then(module => InteractiveGlobe = module.default)
+        // Init the globe from library
+        globe = new InteractiveGlobe({
+            el: scope,
+            texture: `/img/globe/map-${window.innerWidth >= 992 ? '3k' : '2k'}.png`,
+            markers: [...$locations.map(location => {
+                return {
+                    name: location.name,
+                    slug: location.slug,
+                    countryName: location.country.name,
+                    countrySlug: location.country.slug,
+                    lat: location.coordinates.lat,
+                    lng: location.coordinates.lng
+                }
+            })],
+            cameraDistance: 3,
+            onLinkClicked: () => {}
+        })
 
-            // Init the globe from library
-            globe = new Globe({
-                el: scope,
-                texture: `/img/globe/map-${window.innerWidth >= 992 ? '4k' : '2k'}.png`,
-                markers: [...$locations.map(location => {
-                    return {
-                        name: location.name,
-                        slug: location.slug,
-                        countryName: location.country.name,
-                        countrySlug: location.country.slug,
-                        lat: location.coordinates.lat,
-                        lng: location.coordinates.lng
-                    }
-                })],
-                cameraDistance: 3,
-                onLinkClicked: () => {}
-            })
-
-            // Run the globe
-            resize()
-            update()
-        }
+        // Run the globe
+        resize()
+        update()
     })
 </script>
 

src/molecules/Photo.svelte

@@ -54,7 +54,7 @@
                     <source media="(min-width: 768px)" data-srcset={getThumbnail(private_hash, 992)}>
                     <source media="(min-width: 500px)" data-srcset={getThumbnail(private_hash, 650)}>
                     <source media="(min-width: 300px)" data-srcset={getThumbnail(private_hash, 400)}>
-                    <img src={getThumbnail(private_hash, 900)}
+                    <img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
                         width={defaultWidth} height={defaultHeight}
                         alt={imgAlt}
                         class:lazyload={layout === 'list'}