diff --git a/src/components/AccordionTitleItem.tsx b/src/components/AccordionTitleItem.tsx
new file mode 100644
index 0000000..4d2d3be
--- /dev/null
+++ b/src/components/AccordionTitleItem.tsx
@@ -0,0 +1,14 @@
+import { AccordionButton, AccordionIcon, Box } from "@chakra-ui/react";
+
+export default function TitleItem({ word }: { word: string }) {
+ return (
+
+
+
+ {word}
+
+
+
+
+ );
+}
diff --git a/src/components/ProblemInfoMenu.tsx b/src/components/ProblemInfoMenu.tsx
index f9b453c..7882acd 100644
--- a/src/components/ProblemInfoMenu.tsx
+++ b/src/components/ProblemInfoMenu.tsx
@@ -1,12 +1,9 @@
import type React from "react";
-import { useEffect, useState } from "react";
+import { lazy, useEffect, useState } from "react";
import {
Accordion,
- AccordionButton,
- AccordionIcon,
AccordionItem,
AccordionPanel,
- Box,
Link,
Select,
Table,
@@ -21,16 +18,7 @@ import { Link as ReactRouterLink } from "react-router-dom";
import type { DetailResponse, RuntimeInfo } from "../app/services/problem";
import { LanguageMap } from "./Languages";
-const TitleItem = ({ word }: { word: string }) => (
-
-
-
- {word}
-
-
-
-
-);
+const TitleItem = lazy(() => import("../components/AccordionTitleItem"));
interface ProblemInfoMenuProps {
data?: DetailResponse;