Switch online book math rendering from MathJax to KaTeX.

MathJax 2 preset config ignored $...$ delimiters; KaTeX auto-render
matches IDE Preview $/$$ syntax on GitHub Pages.

Author: fooSynaptic

book.toml

@@ -10,13 +10,13 @@ build-dir = "mdbook-out"
 create-missing = false
 
 [output.html]
-mathjax-support = true
+mathjax-support = false
 default-theme = "light"
 preferred-dark-theme = "navy"
 git-repository-url = "https://github.com/fooSynaptic/deepseek-tech-notes"
 site-url = "/deepseek-tech-notes/"
 additional-css = ["theme/mdbook.css"]
-additional-js = ["theme/mathjax-typeset.js"]
+additional-js = ["theme/katex-render.js"]
 
 [output.html.search]
 enable = true

scripts/fix_mdbook_paths.py

@@ -20,20 +20,16 @@
 SKIP_PREFIXES = ("http://", "https://", "//", "mailto:", "javascript:", "data:")
 ATTR_RE = re.compile(r'(href|src)="([^"]+)"')
 PATH_TO_ROOT_RE = re.compile(r'var path_to_root = "[^"]*";')
-MATHJAX_RE = re.compile(r"<!-- MathJax -->\s*<script async src=\"[^\"]+\"></script>")
-MATHJAX_BLOCK = """<!-- MathJax: enable $...$ (IDE / VS Code Preview delimiters) -->
-        <script type="text/x-mathjax-config">
-        MathJax.Hub.Config({
-          tex2jax: {
-            inlineMath: [['$','$'], ['\\\\(','\\\\)']],
-            displayMath: [['$$','$$'], ['\\\\[','\\\\]']],
-            processEscapes: true,
-            processEnvironments: true,
-            skipTags: ['script','noscript','style','textarea','pre','code']
-          }
-        });
-        </script>
-        <script async src="https://cdn.jsdelivr.net/npm/mathjax@2.7.9/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>"""
+MATHJAX_RE = re.compile(
+    r"<!-- MathJax[^>]* -->[\s\S]*?"
+    r"<script async src=\"[^\"]*(?:MathJax|mathjax)[^\"]*\"></script>\s*",
+    re.IGNORECASE,
+)
+KATEX_HEAD = """<!-- KaTeX: $...$ / $$...$$ (IDE / VS Code Preview delimiters) -->
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css">
+        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.js"></script>
+        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/contrib/auto-render.min.js"></script>
+"""
 
 
 def read_site_url() -> str:
@@ -110,7 +106,11 @@ def repl(m: re.Match[str]) -> str:
 
 
 def patch_mathjax(text: str) -> str:
-    return MATHJAX_RE.sub(MATHJAX_BLOCK, text)
+    if "<!-- KaTeX:" in text:
+        return text
+    if MATHJAX_RE.search(text):
+        return MATHJAX_RE.sub(KATEX_HEAD, text, count=1)
+    return text.replace("</head>", KATEX_HEAD + "    </head>", 1)
 
 
 def write_redirect_index() -> None:

theme/katex-render.js

@@ -0,0 +1,22 @@
+// KaTeX auto-render: $...$ / $$...$$ (matches IDE Preview Markdown math).
+document.addEventListener("DOMContentLoaded", function () {
+  if (typeof renderMathInElement !== "function") {
+    return;
+  }
+  var root = document.querySelector("#content main");
+  if (!root) {
+    return;
+  }
+  renderMathInElement(root, {
+    delimiters: [
+      { left: "$$", right: "$$", display: true },
+      { left: "$", right: "$", display: false },
+      { left: "\\[", right: "\\]", display: true },
+      { left: "\\(", right: "\\)", display: false },
+    ],
+    ignoredTags: [
+      "script", "noscript", "style", "textarea", "pre", "code",
+    ],
+    throwOnError: false,
+  });
+});

theme/mathjax-typeset.js

@@ -10,7 +10,7 @@
   margin: 0.35em 0;
 }
 
-/* Inline math spacing */
-.mjx-chtml {
-  font-size: 109% !important;
+/* Inline math spacing (KaTeX) */
+.katex {
+  font-size: 1.09em;
 }