diff --git a/src/pages/App.tsx b/src/pages/App.tsx
index c28ba41c..cb2ebfa5 100644
--- a/src/pages/App.tsx
+++ b/src/pages/App.tsx
@@ -1,36 +1,14 @@
-import React, { Suspense, useEffect } from 'react'
+import React, { Suspense, useEffect, lazy } from 'react'
import { Route, Switch } from 'react-router-dom'
import styled from 'styled-components'
import Header from '../components/Header'
import Popups from '../components/Popups'
import DarkModeQueryParamReader from '../theme/DarkModeQueryParamReader'
-
-import Swap from './Swap'
-import { RedirectPathToSwapOnly, RedirectToSwap } from './Swap/redirects'
-
-import Pool from './Pool'
-
-import RemoveLiquidity from './RemoveLiquidity'
-import {
- RedirectDuplicateTokenIds,
- RedirectOldAddLiquidityPathStructure,
- RedirectToAddLiquidity
-} from './AddLiquidity/redirects'
-
-import Zap from './Zap'
-import ComingSoon from './ComingSoon'
-import Maintenance from './Maintenance'
import Footer from '../components/Footer'
import useFetchAllPairsCallback from '../hooks/useFetchAllPairs'
import { MainnetWarningModal } from '../components/MainnetWarningModal'
import { Web3ReactProvider } from '@web3-react/core'
-import {
- isProductionChainId,
- isProductionEnvironment,
- isStagingEnvironment,
- isTestnetChainId,
- isTestnetEnvironment
-} from '../connectors'
+import { isProductionChainId, isProductionEnvironment, isTestnetChainId, isTestnetEnvironment } from '../connectors'
import { useAccount, useConnectors } from '@starknet-react/core'
import { StarknetChainId } from 'starknet/dist/constants'
import { useAccountDetails } from '../hooks'
@@ -71,6 +49,28 @@ const Marginer = styled.div`
margin-top: 5rem;
`
+const Swap = lazy(() => import('./Swap'))
+const Pool = lazy(() => import('./Pool'))
+const Zap = lazy(() => import('./Zap'))
+const ComingSoon = lazy(() => import('./ComingSoon'))
+const RemoveLiquidity = lazy(() => import('./RemoveLiquidity'))
+
+const RedirectPathToSwapOnly = lazy(() =>
+ import('./Swap/redirects').then(module => ({ default: module.RedirectPathToSwapOnly }))
+)
+
+const RedirectToSwap = lazy(() => import('./Swap/redirects').then(module => ({ default: module.RedirectToSwap })))
+
+const RedirectToAddLiquidity = lazy(() =>
+ import('./AddLiquidity/redirects').then(module => ({ default: module.RedirectToAddLiquidity }))
+)
+const RedirectOldAddLiquidityPathStructure = lazy(() =>
+ import('./AddLiquidity/redirects').then(module => ({ default: module.RedirectOldAddLiquidityPathStructure }))
+)
+const RedirectDuplicateTokenIds = lazy(() =>
+ import('./AddLiquidity/redirects').then(module => ({ default: module.RedirectDuplicateTokenIds }))
+)
+
export default function App() {
const fetchAllPairs = useFetchAllPairsCallback()
const { disconnect } = useConnectors()
@@ -105,22 +105,24 @@ export default function App() {
web3}>
-
-
-
-
-
-
-
-
-
-
-
- {/* */}
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* */}
+
+
+
+
+