diff --git a/src/app/dashboard/[subdomain]/editor/page.tsx b/src/app/dashboard/[subdomain]/editor/page.tsx
index 18b52d18..c064ebbb 100644
--- a/src/app/dashboard/[subdomain]/editor/page.tsx
+++ b/src/app/dashboard/[subdomain]/editor/page.tsx
@@ -3,7 +3,6 @@
 import { useDebounceEffect } from "ahooks"
 import type { Root } from "mdast"
 import { nanoid } from "nanoid"
-import dynamic from "next/dynamic"
 import { useParams, useRouter, useSearchParams } from "next/navigation"
 import {
   ChangeEvent,
@@ -21,6 +20,7 @@ import type { EditorView } from "@codemirror/view"
 import { DateInput } from "@mantine/dates"
 import { useQueryClient } from "@tanstack/react-query"
 
+import { PageContent } from "~/components/common/PageContent"
 import { DashboardMain } from "~/components/dashboard/DashboardMain"
 import { OptionsButton } from "~/components/dashboard/OptionsButton"
 import { PublishButton } from "~/components/dashboard/PublishButton"
@@ -65,13 +65,6 @@ import {
 } from "~/queries/page"
 import { useGetSite } from "~/queries/site"
 
-const DynamicPageContent = dynamic(
-  () => import("~/components/common/PageContent"),
-  {
-    ssr: false,
-  },
-)
-
 export default function SubdomainEditor() {
   const router = useRouter()
   const queryClient = useQueryClient()
@@ -662,7 +655,7 @@ export default function SubdomainEditor() {
                     </div>
                   )}
                   {isRendering && (
-                    <DynamicPageContent
+                    <PageContent
                       className="bg-white px-5 overflow-scroll pb-[200px] h-full flex-1"
                       parsedContent={parsedContent}
                       inputRef={previewRef}
diff --git a/src/app/site/[site]/preview/[previewId]/page.tsx b/src/app/site/[site]/preview/[previewId]/page.tsx
index bb6703c8..dc45fc59 100644
--- a/src/app/site/[site]/preview/[previewId]/page.tsx
+++ b/src/app/site/[site]/preview/[previewId]/page.tsx
@@ -1,18 +1,10 @@
 "use client"
 
-import dynamic from "next/dynamic"
-
+import { PageContent } from "~/components/common/PageContent"
 import { useTranslation } from "~/lib/i18n/client"
 import { useGetPage } from "~/queries/page"
 import { useGetSite } from "~/queries/site"
 
-const DynamicPageContent = dynamic(
-  () => import("~/components/common/PageContent"),
-  {
-    ssr: false,
-  },
-)
-
 export default function SitePreviewPage({
   params,
 }: {
@@ -54,11 +46,11 @@ export default function SitePreviewPage({
             </h2>
           )}
         </div>
-        <DynamicPageContent
+        <PageContent
           className="mt-10"
           content={page.data?.metadata?.content?.content}
           toc={true}
-        ></DynamicPageContent>
+        ></PageContent>
       </article>
     </>
   )
diff --git a/src/components/dashboard/ImportPreview.tsx b/src/components/dashboard/ImportPreview.tsx
index 738f438c..0b9638c7 100644
--- a/src/components/dashboard/ImportPreview.tsx
+++ b/src/components/dashboard/ImportPreview.tsx
@@ -1,13 +1,10 @@
 import type { NoteMetadata } from "crossbell"
-import dynamic from "next/dynamic"
 import { useState } from "react"
 
 import { useDate } from "~/hooks/useDate"
 import { useTranslation } from "~/lib/i18n/client"
 
-const DynamicPageContent = dynamic(() => import("../common/PageContent"), {
-  ssr: false,
-})
+import { PageContent } from "../common/PageContent"
 
 export const ImportPreview = ({ note }: { note: NoteMetadata }) => {
   const date = useDate()
@@ -52,10 +49,7 @@ export const ImportPreview = ({ note }: { note: NoteMetadata }) => {
         >
           {t("Show more")}
         </div>
-        <DynamicPageContent
-          className="mt-4"
-          content={note?.content}
-        ></DynamicPageContent>
+        <PageContent className="mt-4" content={note?.content}></PageContent>
       </div>
     </article>
   )
diff --git a/src/components/site/PostFooter.tsx b/src/components/site/PostFooter.tsx
index e779a86f..8020bd64 100644
--- a/src/components/site/PostFooter.tsx
+++ b/src/components/site/PostFooter.tsx
@@ -19,7 +19,6 @@ const DynamicComment = dynamic(() => import("~/components/common/Comment"), {
       <p>Loading comments...</p>
     </div>
   ),
-  ssr: false,
 })
 
 export const usePostFooterInView = () => {
diff --git a/src/lib/read-files.ts b/src/lib/read-files.ts
index 3913a5f3..c8e6a088 100644
--- a/src/lib/read-files.ts
+++ b/src/lib/read-files.ts
@@ -1,4 +1,5 @@
 import { getDefaultSlug } from "~/lib/default-slug"
+import { renderPageContent } from "~/markdown"
 
 const makeArray = (value: any) => {
   if (Array.isArray(value)) {
@@ -10,9 +11,8 @@ const makeArray = (value: any) => {
   return [value]
 }
 
-export const readFiles = async (files: FileList) => {
+export const readFiles = (files: FileList) => {
   const promises = []
-  const { renderPageContent } = await import("~/markdown")
   for (let i = 0; i < files.length; i++) {
     const file = files[i]
     promises.push(