diff --git a/src/components/site/PostFooter.tsx b/src/components/site/PostFooter.tsx
index 07cbc522..5bdd24f4 100644
--- a/src/components/site/PostFooter.tsx
+++ b/src/components/site/PostFooter.tsx
@@ -13,6 +13,11 @@ import { ExpandedCharacter, ExpandedNote } from "~/lib/types"
 
 const key = ["PostFooterInView"]
 
+const DynamicComment = dynamic(() => import("~/components/common/Comment"), {
+  // TODO Skeleton
+  loading: () => <p>Loading comments...</p>,
+})
+
 export const usePostFooterInView = () => {
   const { data } = useQuery<boolean>({
     queryKey: key,
@@ -37,10 +42,6 @@ export const PostFooter = ({
 
   const { t } = useTranslation("common")
 
-  const DynamicComment = dynamic(() => import("~/components/common/Comment"), {
-    loading: () => <p>{t("Loading comments")}...</p>,
-  })
-
   return (
     <>
       <div
diff --git a/src/lib/i18n/locales/zh/common.json b/src/lib/i18n/locales/zh/common.json
index 0200b98e..a6918022 100644
--- a/src/lib/i18n/locales/zh/common.json
+++ b/src/lib/i18n/locales/zh/common.json
@@ -88,6 +88,5 @@
   "Comment Without Login": "免登录评论",
   "Name": "昵称",
   "Email": "电子邮箱",
-  "You'll use an official public account for comments and give up blockchain ownership": "你将使用官方公共账号进行评论并放弃区块链所有权",
-  "Loading comments": "加载评论中"
+  "You'll use an official public account for comments and give up blockchain ownership": "你将使用官方公共账号进行评论并放弃区块链所有权"
 }
diff --git a/src/markdown/index.ts b/src/markdown/index.ts
index 83fd517b..5b0d631e 100644
--- a/src/markdown/index.ts
+++ b/src/markdown/index.ts
@@ -50,6 +50,17 @@ import { remarkPangu } from "./remark-pangu"
 import { remarkYoutube } from "./remark-youtube"
 import sanitizeScheme from "./sanitize-schema"
 
+const Style = dynamic(() => import("~/components/common/Style"))
+const Mention = dynamic(() => import("~/components/ui/Mention"))
+const Mermaid = dynamic(() => import("~/components/ui/Mermaid"))
+const Tweet = dynamic(() => import("~/components/ui/Tweet"))
+const GithubRepo = dynamic(() => import("~/components/ui/GithubRepo"))
+const APlayer = dynamic(() => import("~/components/ui/APlayer"))
+
+const DPlayer = dynamic(() => import("~/components/ui/DPlayer"), {
+  ssr: false,
+})
+
 export type MarkdownEnv = {
   excerpt: string
   frontMatter: Record<string, any>
@@ -213,17 +224,6 @@ export const renderPageContent = (
       .use(rehypeKatex)
 
     if (!html) {
-      const Style = dynamic(() => import("~/components/common/Style"))
-      const Mention = dynamic(() => import("~/components/ui/Mention"))
-      const Mermaid = dynamic(() => import("~/components/ui/Mermaid"))
-      const Tweet = dynamic(() => import("~/components/ui/Tweet"))
-      const GithubRepo = dynamic(() => import("~/components/ui/GithubRepo"))
-      const APlayer = dynamic(() => import("~/components/ui/APlayer"))
-
-      const DPlayer = dynamic(() => import("~/components/ui/DPlayer"), {
-        ssr: false,
-      })
-
       pipeline.use(rehypeReact, {
         createElement: createElement,
         components: {