From db6350771d7668f27db026c42e3885a097989f1e Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 16 May 2023 15:35:24 +0700
Subject: optimize render

---
 src/pages/_document.jsx | 10 ++++++----
 src/pages/index.jsx     | 26 ++++++++++++++------------
 2 files changed, 20 insertions(+), 16 deletions(-)

(limited to 'src/pages')

diff --git a/src/pages/_document.jsx b/src/pages/_document.jsx
index b76f314f..2130c097 100644
--- a/src/pages/_document.jsx
+++ b/src/pages/_document.jsx
@@ -10,14 +10,16 @@ export default function MyDocument() {
         <link rel='icon' href='/favicon.ico' />
         <link rel='manifest' href='/manifest.json' />
         <link rel='apple-touch-icon' href='/icon.jpg'></link>
-        <link rel="apple-touch-startup-image" href="/images/splash/launch.png"/>
+        <link rel='apple-touch-startup-image' href='/images/splash/launch.png' />
 
         <meta name='mobile-web-app-capable' content='yes' />
-        <meta name="apple-mobile-web-app-capable" content="yes" />
-        <meta name="apple-mobile-web-app-status-bar-style" content="default" />
-        <meta name="apple-mobile-web-app-title" content="Indoteknik.com" />
+        <meta name='apple-mobile-web-app-capable' content='yes' />
+        <meta name='apple-mobile-web-app-status-bar-style' content='default' />
+        <meta name='apple-mobile-web-app-title' content='Indoteknik.com' />
         <meta name='theme-color' content='#fff' />
 
+        <link rel='prefetch' href='/images/logo-indoteknik-gear.png' />
+
         <meta name='facebook-domain-verification' content='328wmjs7hcnz74rwsqzxvq50rmbtm2' />
         <Script
           async
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 8cf335c4..31c6b240 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -8,7 +8,6 @@ import Seo from '@/core/components/Seo'
 import { useQuery } from 'react-query'
 import odooApi from '@/core/api/odooApi'
 import Image from 'next/image'
-import CustomerReviews from '@/lib/review/components/CustomerReviews'
 import DelayRender from '@/core/components/elements/DelayRender/DelayRender'
 
 const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'))
@@ -25,6 +24,7 @@ const PopularProduct = dynamic(() => import('@/lib/home/components/PopularProduc
 const CategoryHomeId = dynamic(() => import('@/lib/home/components/CategoryHomeId'), {
   loading: () => <PopularProductSkeleton />
 })
+const CustomerReviews = dynamic(() => import('@/lib/review/components/CustomerReviews'))
 
 export default function Home() {
   const fetchSecondHeroBanner = async () => await odooApi('GET', '/api/v1/banner?type=index-a-2')
@@ -70,23 +70,23 @@ export default function Home() {
               <HeroBanner />
             </div>
             <div className='w-3/12'>
-              <DelayRender delay={200}>
+              <DelayRender renderAfter={200}>
                 <PopularProduct />
               </DelayRender>
             </div>
           </div>
 
           <div className='my-16 flex flex-col gap-y-16'>
-            <DelayRender delay={300}>
+            <DelayRender renderAfter={400}>
               <PreferredBrand />
             </DelayRender>
-            <DelayRender delay={400}>
+            <DelayRender renderAfter={600}>
               <FlashSale />
             </DelayRender>
-            <DelayRender delay={500}>
+            <DelayRender renderAfter={1000}>
               <CategoryHomeId />
             </DelayRender>
-            <DelayRender delay={600}>
+            <DelayRender renderAfter={1200}>
               <CustomerReviews />
             </DelayRender>
           </div>
@@ -94,21 +94,23 @@ export default function Home() {
       </DesktopView>
 
       <MobileView>
-        <HeroBanner />
+        <DelayRender renderAfter={200}>
+          <HeroBanner />
+        </DelayRender>
         <div className='flex flex-col gap-y-12 my-6'>
-          <DelayRender delay={300}>
+          <DelayRender renderAfter={400}>
             <PreferredBrand />
           </DelayRender>
-          <DelayRender delay={600}>
+          <DelayRender renderAfter={600}>
             <FlashSale />
           </DelayRender>
-          <DelayRender delay={900}>
+          <DelayRender renderAfter={800}>
             <PopularProduct />
           </DelayRender>
-          <DelayRender delay={1200}>
+          <DelayRender renderAfter={1000}>
             <CategoryHomeId />
           </DelayRender>
-          <DelayRender delay={1500}>
+          <DelayRender renderAfter={1200}>
             <CustomerReviews />
           </DelayRender>
         </div>
-- 
cgit v1.2.3