mirror of
https://github.com/coder/coder.git
synced 2026-09-24 15:04:27 +08:00
perf(site): split InlineMarkdown out of Markdown to avoid loading PrismJS in initial bundle (#24192)
\`InlineMarkdown\` and \`MemoizedInlineMarkdown\` lived in
\`Markdown.tsx\`
alongside a static \`import { Prism as SyntaxHighlighter } from
"react-syntax-highlighter"\` — the full PrismJS build with ~300 language
grammars. Because \`DashboardLayout\` eagerly imports
\`AnnouncementBannerView → InlineMarkdown\`, every authenticated page
loaded and evaluated the entire Prism/refractor bundle on startup even
though syntax highlighting is only used in secondary views.
This PR moves \`InlineMarkdown\` and \`MemoizedInlineMarkdown\` into
their
own \`InlineMarkdown.tsx\` file that depends only on \`react-markdown\`
and
updates all six consumers to import from the new module.
\`Markdown.tsx\`
keeps the PrismJS import for the full \`Markdown\` component, which is
only reached through lazy-loaded routes.
> 🤖 Generated by Coder Agents
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import type { FC } from "react";
|
||||
import { InlineMarkdown } from "#/components/Markdown/Markdown";
|
||||
import { InlineMarkdown } from "#/components/Markdown/InlineMarkdown";
|
||||
import { readableForegroundColor } from "#/utils/colors";
|
||||
|
||||
interface AnnouncementBannerViewProps {
|
||||
|
||||
@@ -4,7 +4,7 @@ import type { WorkspaceAgent, WorkspaceResource } from "#/api/typesGenerated";
|
||||
import { ChevronDownIcon } from "#/components/AnimatedIcons/ChevronDown";
|
||||
import { Button } from "#/components/Button/Button";
|
||||
import { CopyableValue } from "#/components/CopyableValue/CopyableValue";
|
||||
import { MemoizedInlineMarkdown } from "#/components/Markdown/Markdown";
|
||||
import { MemoizedInlineMarkdown } from "#/components/Markdown/InlineMarkdown";
|
||||
import { Stack } from "#/components/Stack/Stack";
|
||||
import {
|
||||
Tooltip,
|
||||
|
||||
@@ -9,7 +9,7 @@ import type {
|
||||
WorkspaceBuildParameter,
|
||||
} from "#/api/typesGenerated";
|
||||
import { ConfirmDialog } from "#/components/Dialogs/ConfirmDialog/ConfirmDialog";
|
||||
import { MemoizedInlineMarkdown } from "#/components/Markdown/Markdown";
|
||||
import { MemoizedInlineMarkdown } from "#/components/Markdown/InlineMarkdown";
|
||||
import { UpdateBuildParametersDialog } from "#/modules/workspaces/WorkspaceMoreActions/UpdateBuildParametersDialog";
|
||||
import { UpdateBuildParametersDialogExperimental } from "#/modules/workspaces/WorkspaceMoreActions/UpdateBuildParametersDialogExperimental";
|
||||
|
||||
|
||||
Reference in New Issue
Block a user