v3: code quality pass, various bug fixes

src/components/Markdown.tsx

@@ -1,3 +1,4 @@
+import { useMemo } from "react";
 import { Link } from "react-router";
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
@@ -15,9 +16,25 @@ function preprocessMentions(text: string): string {
   return text.replace(/(?<![[(])@([\w]+)/g, "[@$1](/users/$1)");
 }
 
+// Static components object — defined once at module scope to avoid recreation on every render
+const MARKDOWN_COMPONENTS: React.ComponentProps<typeof ReactMarkdown>["components"] = {
+  a: ({ href, children: linkChildren }) => {
+    if (href?.startsWith("/users/")) {
+      return <Link to={href}>{linkChildren}</Link>;
+    }
+    return (
+      <a href={href} target="_blank" rel="noopener noreferrer">
+        {linkChildren}
+      </a>
+    );
+  },
+};
+
 export function Markdown(
   { children, className, inline = false }: MarkdownProps,
 ) {
+  const processed = useMemo(() => preprocessMentions(children), [children]);
+
   return (
     <div
       className={`md${className ? ` ${className}` : ""}${
@@ -26,20 +43,9 @@ export function Markdown(
     >
       <ReactMarkdown
         remarkPlugins={REMARK_PLUGINS}
-        components={{
-          a: ({ href, children: linkChildren }) => {
-            if (href?.startsWith("/users/")) {
-              return <Link to={href}>{linkChildren}</Link>;
-            }
-            return (
-              <a href={href} target="_blank" rel="noopener noreferrer">
-                {linkChildren}
-              </a>
-            );
-          },
-        }}
+        components={MARKDOWN_COMPONENTS}
       >
-        {preprocessMentions(children)}
+        {processed}
       </ReactMarkdown>
     </div>
   );