diff --git a/frontend/public/seo/sitemap.xml b/frontend/public/seo/sitemap.xml
index 33657e5c2..7f4f6d631 100644
--- a/frontend/public/seo/sitemap.xml
+++ b/frontend/public/seo/sitemap.xml
@@ -6,16 +6,16 @@
 >
   <url>
     <loc>https://votogether.com/</loc>
-    <lastmod>2023-09-13T04:22:25.347Z</lastmod>
+    <lastmod>2023-09-14T06:06:57.224Z</lastmod>
   </url>
 
   <url>
     <loc>https://votogether.com/login</loc>
-    <lastmod>2023-09-13T04:22:25.347Z</lastmod>
+    <lastmod>2023-09-14T06:06:57.224Z</lastmod>
   </url>
 
   <url>
     <loc>https://votogether.com/ranking</loc>
-    <lastmod>2023-09-13T04:22:25.347Z</lastmod>
+    <lastmod>2023-09-14T06:06:57.224Z</lastmod>
   </url>
 </urlset>
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index bb8b11cc5..0d7708033 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,3 +1,4 @@
+import { Suspense } from 'react';
 import { RouterProvider } from 'react-router-dom';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
@@ -11,6 +12,7 @@ import router from '@routes/router';
 import ErrorBoundaryForTopClass from '@pages/ErrorBoundaryForTopClass';
 
 import ChannelTalk from '@components/ChannelTalk';
+import Skeleton from '@components/common/Skeleton';
 
 import { GlobalStyle } from '@styles/globalStyle';
 import { theme } from '@styles/theme';
@@ -29,7 +31,9 @@ const App = () => (
         <GlobalStyle />
         <PostOptionProvider>
           <AuthProvider>
-            <RouterProvider router={router} />
+            <Suspense fallback={<Skeleton isLarge />}>
+              <RouterProvider router={router} />
+            </Suspense>
           </AuthProvider>
         </PostOptionProvider>
       </ThemeProvider>
diff --git a/frontend/src/routes/router.tsx b/frontend/src/routes/router.tsx
index 62234a4a3..6b1d4897a 100644
--- a/frontend/src/routes/router.tsx
+++ b/frontend/src/routes/router.tsx
@@ -1,7 +1,7 @@
+import { lazy } from 'react';
 import { createBrowserRouter } from 'react-router-dom';
 
 import Announcement from '@pages/Announcement';
-import Login from '@pages/auth/Login';
 import Redirection from '@pages/auth/Redirection';
 import Error from '@pages/Error';
 import Home from '@pages/Home';
@@ -11,8 +11,6 @@ import CreatePostPage from '@pages/post/CreatePostPage';
 import EditPostPage from '@pages/post/EditPostPage';
 import PostDetailPage from '@pages/post/PostDetail';
 import Ranking from '@pages/Ranking';
-import RegisterPersonalInfo from '@pages/user/RegisterPersonalInfo';
-import VoteStatisticsPage from '@pages/VoteStatisticsPage';
 
 import ScrollToTop from '@components/common/ScrollToTop';
 import RouteChangeTracker from '@components/RouteChangeTracker';
@@ -21,6 +19,10 @@ import { PATH } from '@constants/path';
 
 import PrivateRoute from './PrivateRoute';
 
+const Login = lazy(() => import('@pages/auth/Login'));
+const RegisterPersonalInfo = lazy(() => import('@pages/user/RegisterPersonalInfo'));
+const VoteStatisticsPage = lazy(() => import('@pages/VoteStatisticsPage'));
+
 const router = createBrowserRouter([
   {
     path: PATH.HOME,
diff --git a/frontend/webpack.common.js b/frontend/webpack.common.js
index 8c02bd7d1..7ac442629 100644
--- a/frontend/webpack.common.js
+++ b/frontend/webpack.common.js
@@ -11,7 +11,7 @@ module.exports = {
   mode: 'development',
   entry: './src/index.tsx',
   output: {
-    filename: 'bundle.js',
+    filename: '[contenthash].bundle.js',
     path: path.resolve(__dirname, 'dist'),
     clean: true,
     publicPath: '/',