Enhance load on home screen (#94)

* feat: move images tdifferent file * feat: enhance speed with lazy loading & skeletons * fix: script * fix: remove useMemo
onc-healthit · Jul 26, 2024 · 0de0648 · 0de0648
1 parent 002e0d9
commit 0de0648
Show file tree

Hide file tree

Showing 3 changed files with 287 additions and 284 deletions.
diff --git a/public/home/index.ts b/public/home/index.ts
@@ -0,0 +1,14 @@
+export { default as atmSvg } from './alternative.svg'
+export { default as cCdaSvg } from './c-cda.svg'
+export { default as cpoeSvg } from './cpoe.svg'
+export { default as cqmtsvg } from './CQMT.svg'
+export { default as eRxSvg } from './erx.svg'
+export { default as phrSvg } from './phr.svg'
+export { default as directSvg } from './direct.svg'
+export { default as hl7Svg } from './hl7.svg'
+export { default as igSvg } from './ig.svg'
+export { default as iheSvg } from './ihe.svg'
+export { default as infernoSvg } from './inferno.svg'
+export { default as infernoValidatorSvg } from './InfernoValidator.svg'
+export { default as lanternSvg } from './lantern.svg'
+export { default as referenceDataSvg } from './reference-data.svg'
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -36,18 +36,19 @@ export default function RootLayout({ children }: { children: React.ReactNode })
   return (
     <html lang="en">
       <head>
+        <Script async strategy="afterInteractive" src="https://www.googletagmanager.com/gtag/js?id=G-ZSC2EVZSVD" />
         <Script
-          async
+          id="google-analytics"
           strategy="afterInteractive"
-          src="https://www.googletagmanager.com/gtag/js?id= G-ZSC2EVZSVD"
-        ></Script>
-        <Script strategy="beforeInteractive" id="google-analytics">
-          {`window.dataLayer = window.dataLayer || [];
-            function gtag(){dataLayer.push(arguments);}
-            gtag('js', new Date());
-            gtag('config', 'G-ZSC2EVZSVD');
-          `}
-        </Script>
+          dangerouslySetInnerHTML={{
+            __html: `
+              window.dataLayer = window.dataLayer || [];
+              function gtag(){dataLayer.push(arguments);}
+              gtag('js', new Date());
+              gtag('config', 'G-ZSC2EVZSVD');
+            `,
+          }}
+        />
       </head>
       <body>
         <ThemeProvider theme={lightTheme}>
@@ -58,9 +59,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
                 <Box role="main" sx={pageContainer}>
                   {children}
                   <Box sx={footer}>
-                    {/* Global Ankle */}
                     <Ankle />
-                    {/* Global Footer */}
                     <Footer />
                   </Box>
                 </Box>