rNLKJA · rNLKJA · Jul 18, 2026 · Jul 18, 2026 · Jul 18, 2026
diff --git a/components/knowledge/KatexFormula.jsx b/components/knowledge/KatexFormula.jsx
@@ -0,0 +1,50 @@
+import katex from "katex";
+
+/*
+ * Split out from KnowledgeLayout.jsx so pages that never render maths don't
+ * pull the katex JS (and its CSS, imported alongside these components) into
+ * their bundle. Only the ~39 knowledge topics that use <Formula>/<TeX> import
+ * from this module.
+ */
+
+/**
+ * Centred display formula, rendered with KaTeX.
+ * `children` is a LaTeX string (use a template literal; `\\` starts a new line,
+ * and `\begin{aligned}…\end{aligned}` lays out a multi-step derivation).
+ * `label` is the accessible description read by screen readers.
+ * `caption` optionally annotates the formula beneath it.
+ */
+export function Formula({ children, label, caption }) {
+  const tex = typeof children === "string" ? children : String(children ?? "");
+  const html = katex.renderToString(tex, {
+    displayMode: true,
+    throwOnError: false,
+    strict: false,
+  });
+  return (
+    <div className="not-prose my-7">
+      <div
+        className="px-5 py-5 bg-[#F7F7F7] dark:bg-[#0D0D0D] border border-[#E0E0E0] dark:border-[#2A2A2A] overflow-x-auto text-[#1A1A1A] dark:text-[#E8E8E8]"
+        role="math"
+        aria-label={label}
+        dangerouslySetInnerHTML={{ __html: html }}
+      />
+      {caption && (
+        <p className="mt-2 text-[12px] text-[#7A7A7A] dark:text-[#6E6E6E] [text-wrap:pretty]">
+          {caption}
+        </p>
+      )}
+    </div>
+  );
+}
+
+/** Inline maths, rendered with KaTeX. `children` is a LaTeX string. */
+export function TeX({ children, label }) {
+  const tex = typeof children === "string" ? children : String(children ?? "");
+  const html = katex.renderToString(tex, {
+    displayMode: false,
+    throwOnError: false,
+    strict: false,
+  });
+  return <span role="math" aria-label={label || tex} dangerouslySetInnerHTML={{ __html: html }} />;
+}
diff --git a/components/knowledge/KnowledgeLayout.jsx b/components/knowledge/KnowledgeLayout.jsx
@@ -1,6 +1,5 @@
 import Head from "next/head";
 import Link from "next/link";
-import katex from "katex";
 import SeoHead from "@/components/seo/SeoHead";
 import { useI18n } from "@/contexts/I18nContext";
 
@@ -12,12 +11,13 @@
  * frame — header, provenance strip, table of contents, prose body, refresher,
  * footer nav, SEO + JSON-LD — so each topic page only writes its content.
  *
- * Companion primitives (KSection, Callout, Formula, Figure, Term, KList) are
- * exported from this module and are designed to sit inside <prose> safely
- * (they opt out with `not-prose` where the typography plugin would interfere).
+ * Companion primitives (KSection, Callout, Figure, Term) are exported from
+ * this module and are designed to sit inside <prose> safely (they opt out
+ * with `not-prose` where the typography plugin would interfere). Formula/TeX
+ * live in ./KatexFormula.jsx so pages without maths don't bundle katex.
  */
 
 const ACCENT = "#FF3C3C";

 /** Provenance row — "where this knowledge comes from". */
 function MetaItem({ label, children }) {
@@ -289,48 +289,6 @@
   );
 }
 
-/**
- * Centred display formula, rendered with KaTeX.
- * `children` is a LaTeX string (use a template literal; `\\` starts a new line,
- * and `\begin{aligned}…\end{aligned}` lays out a multi-step derivation).
- * `label` is the accessible description read by screen readers.
- * `caption` optionally annotates the formula beneath it.
- */
-export function Formula({ children, label, caption }) {
-  const tex = typeof children === "string" ? children : String(children ?? "");
-  const html = katex.renderToString(tex, {
-    displayMode: true,
-    throwOnError: false,
-    strict: false,
-  });
-  return (
-    <div className="not-prose my-7">
-      <div
-        className="px-5 py-5 bg-[#F7F7F7] dark:bg-[#0D0D0D] border border-[#E0E0E0] dark:border-[#2A2A2A] overflow-x-auto text-[#1A1A1A] dark:text-[#E8E8E8]"
-        role="math"
-        aria-label={label}
-        dangerouslySetInnerHTML={{ __html: html }}
-      />
-      {caption && (
-        <p className="mt-2 text-[12px] text-[#7A7A7A] dark:text-[#6E6E6E] [text-wrap:pretty]">
-          {caption}
-        </p>
-      )}
-    </div>
-  );
-}
-
-/** Inline maths, rendered with KaTeX. `children` is a LaTeX string. */
-export function TeX({ children, label }) {
-  const tex = typeof children === "string" ? children : String(children ?? "");
-  const html = katex.renderToString(tex, {
-    displayMode: false,
-    throwOnError: false,
-    strict: false,
-  });
-  return <span role="math" aria-label={label || tex} dangerouslySetInnerHTML={{ __html: html }} />;
-}
-
 /** Figure wrapper for inline SVG diagrams + caption. */
 export function Figure({ children, caption }) {
   return (

diff --git a/components/knowledge/content/artificial-intelligence.jsx b/components/knowledge/content/artificial-intelligence.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/artificial-intelligence.

diff --git a/components/knowledge/content/bayesian-statistics.jsx b/components/knowledge/content/bayesian-statistics.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/bayesian-statistics.

diff --git a/components/knowledge/content/calculus-optimisation.jsx b/components/knowledge/content/calculus-optimisation.jsx
@@ -1,5 +1,6 @@
 import Link from "next/link";
-import { KSection, Callout, Formula, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/calculus-optimisation.

diff --git a/components/knowledge/content/causal-inference.jsx b/components/knowledge/content/causal-inference.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/causal-inference.

diff --git a/components/knowledge/content/cluster-cloud-computing.jsx b/components/knowledge/content/cluster-cloud-computing.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/cluster-cloud-computing.

diff --git a/components/knowledge/content/clustering.jsx b/components/knowledge/content/clustering.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/clustering.

diff --git a/components/knowledge/content/computational-statistics.jsx b/components/knowledge/content/computational-statistics.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/computational-statistics.

diff --git a/components/knowledge/content/conformal-prediction.jsx b/components/knowledge/content/conformal-prediction.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/conformal-prediction.

diff --git a/components/knowledge/content/deep-learning.jsx b/components/knowledge/content/deep-learning.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/deep-learning.

diff --git a/components/knowledge/content/differential-privacy.jsx b/components/knowledge/content/differential-privacy.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/differential-privacy.

diff --git a/components/knowledge/content/ensemble-methods.jsx b/components/knowledge/content/ensemble-methods.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/ensemble-methods.

diff --git a/components/knowledge/content/extreme-value-theory.jsx b/components/knowledge/content/extreme-value-theory.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/extreme-value-theory.

diff --git a/components/knowledge/content/feature-engineering.jsx b/components/knowledge/content/feature-engineering.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/feature-engineering.

diff --git a/components/knowledge/content/gaussian-processes.jsx b/components/knowledge/content/gaussian-processes.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/gaussian-processes.

diff --git a/components/knowledge/content/graph-neural-networks.jsx b/components/knowledge/content/graph-neural-networks.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/graph-neural-networks.

diff --git a/components/knowledge/content/information-retrieval.jsx b/components/knowledge/content/information-retrieval.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/information-retrieval.

diff --git a/components/knowledge/content/kalman-filter.jsx b/components/knowledge/content/kalman-filter.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/kalman-filter.

diff --git a/components/knowledge/content/large-language-models.jsx b/components/knowledge/content/large-language-models.jsx
@@ -1,12 +1,6 @@
 import Link from "next/link";
-import {
-  KSection,
-  Callout,
-  Formula,
-  Figure,
-  TeX,
-  Term,
-} from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula, TeX } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/large-language-models.

diff --git a/components/knowledge/content/linear-algebra.jsx b/components/knowledge/content/linear-algebra.jsx
@@ -1,5 +1,6 @@
 import Link from "next/link";
-import { KSection, Callout, Formula, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/linear-algebra.

diff --git a/components/knowledge/content/linear-statistical-models.jsx b/components/knowledge/content/linear-statistical-models.jsx
@@ -1,5 +1,6 @@
 import Link from "next/link";
-import { KSection, Callout, Formula, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { KSection, Callout, Figure, Term } from "@/components/knowledge/KnowledgeLayout";
+import { Formula } from "@/components/knowledge/KatexFormula";
 
 /**
  * Per-locale content for /knowledge/linear-statistical-models.