feat: add code-splitting example

src/common/components/code-splitting/index.tsx

@@ -0,0 +1,8 @@
+/**
+ * Just a code-splitting example.
+ * This component will be built into a separate chunk
+ * @constructor
+ */
+const CodeSplitting = () => <div>Code-splitting in action</div>;
+
+export default CodeSplitting;

src/pages/not-lazy/index.tsx

@@ -1,16 +1,26 @@
+import { Suspense } from '@lomray/consistent-suspense';
 import type { FCRoute } from '@lomray/vite-ssr-boost/interfaces/fc-route';
+import { lazy } from 'react';
 import { Link } from 'react-router-dom';
+import Fallback from '@components/fallback';
 import RouteManager from '@services/route-manager.ts';
 import styles from './styles.module.scss';
 
+const CodeSplitting = lazy(() => import('@components/code-splitting'));
+
 /**
  * Demo page with no lazy import
  * @constructor
  */
 const NotLazy: FCRoute = () => (
   <>
     <div className={styles.container}>
-      <p className={styles.text}>Styled text</p>
+      <div className={styles.text}>Styled text</div>
+      <div>
+        <Suspense fallback={<Fallback />}>
+          <CodeSplitting />
+        </Suspense>
+      </div>
     </div>
     <div className="mr20">
       <Link to={RouteManager.makeURL('home')}>Go back</Link>

src/pages/not-lazy/styles.module.scss

@@ -1,5 +1,6 @@
 .container {
   display: flex;
+  flex-direction: column;
   justify-content: center;
 }