fix(math): adjust interval timing and improve math rendering logic

Author: Simon-He95

playground/src/App.vue

@@ -7,7 +7,7 @@ const content = ref<string>('')
 // To avoid flashing sequences like ":::" during streaming (which later
 // become an AdmonitionNode), we look ahead when encountering ":" and
 // defer appending consecutive colons until a non-colon character is seen.
-useInterval(10, {
+useInterval(16, {
   callback() {
     const cur = content.value.length
     if (cur >= streamContent.length)

playground/src/const/markdown.ts

@@ -33,52 +33,52 @@ export const streamContent = `>>>I'll create a simple Electron + Vue chat applic
 ## 1. 泰勒公式（Taylor's Formula）
 
 ### 一般形式（在点 \(x = a\) 处展开）：
-\\[
+\[
 f(x) = f(a) + f'(a)(x-a) + \frac{f''(a)}{2!}(x-a)^2 + \frac{f'''(a)}{3!}(x-a)^3 + \cdots + \frac{f^{(n)}(a)}{n!}(x-a)^n + R_n(x)
-\\]
+\]
 
 其中：
 - \(f^{(k)}(a)\) 是 \(f(x)\) 在 \(x=a\) 处的 \(k\) 阶导数
 - \(R_n(x)\) 是余项，常见形式有拉格朗日余项：
-\\[
+\[
 R_n(x) = \frac{f^{(n+1)}(xi)}{(n+1)!}(x-a)^{n+1}, \quad xi \text{ 在 } a \text{ 和 } x \text{ 之间}
-\\]
+\]
 
 ---
 
 ## 2. 麦克劳林公式（Maclaurin's Formula，即 \(a=0\) 时的泰勒公式）：
-\\[
+\[
 f(x) = f(0) + f'(0)x + \frac{f''(0)}{2!}x^2 + \frac{f'''(0)}{3!}x^3 + \cdots + \frac{f^{(n)}(0)}{n!}x^n + R_n(x)
-\\]
+\]
 
 ---
 
 ## 3. 常见函数的麦克劳林展开（前几项）
 
 - **指数函数**：
-\\[
+\[
 e^x = 1 + x + \frac{x^2}{2!} + \frac{x^3}{3!} + \cdots + \frac{x^n}{n!} + \cdots, \quad x \in \mathbb{R}
-\\]
+\]
 
 - **正弦函数**：
-\\[
+\[
 \\sin x = x - \frac{x^3}{3!} + \frac{x^5}{5!} - \frac{x^7}{7!} + \cdots + (-1)^n \frac{x^{2n+1}}{(2n+1)!} + \cdots
-\\]
+\]
 
 - **余弦函数**：
-\\[
+\[
 \cos x = 1 - \frac{x^2}{2!} + \frac{x^4}{4!} - \frac{x^6}{6!} + \cdots + (-1)^n \frac{x^{2n}}{(2n)!} + \cdots
-\\]
+\]
 
 - **自然对数**（在 \(x=0\) 附近）：
-\\[
+\[
 \ln(1+x) = x - \frac{x^2}{2} + \frac{x^3}{3} - \frac{x^4}{4} + \cdots + (-1)^{n-1} \frac{x^n}{n} + \cdots, \quad -1 < x \le 1
-\\]
+\]
 
 - **二项式展开**（\( (1+x)^m \)，\(m\) 为实数）：
-\\[
+\[
 (1+x)^m = 1 + mx + \frac{m(m-1)}{2!}x^2 + \frac{m(m-1)(m-2)}{3!}x^3 + \cdots, \quad |x| < 1
-\\]
+\]
 
 - **公式**
 

src/components/MathBlockNode/MathBlockNode.vue

@@ -69,8 +69,10 @@ onMounted(() => {
 onBeforeUnmount(() => {
   // prevent any pending worker responses from touching the DOM
   isUnmounted = true
-  // increment id so any in-flight render is considered stale
-  currentRenderId++
+  if (currentAbortController) {
+    currentAbortController.abort()
+    currentAbortController = null
+  }
 })
 </script>
 

src/utils/markdown/plugins/math.ts

@@ -222,7 +222,6 @@ export function applyMath(md: MarkdownIt, mathOpts?: MathOptions) {
     const delimiters: [string, string][] = [
       ['$$', '$$'],
       ['\(', '\)'],
-      ['\\(', '\\)'],
     ]
     let searchPos = 0
     // use findMatchingClose from util
@@ -258,6 +257,7 @@ export function applyMath(md: MarkdownIt, mathOpts?: MathOptions) {
         const index = src.indexOf(open, searchPos)
         if (index === -1)
           break
+
         // If the delimiter is immediately preceded by a ']' (possibly with
         // intervening spaces), it's likely part of a markdown link like
         // `[text](...)`, so we should not treat this '(' as the start of
@@ -319,7 +319,7 @@ export function applyMath(md: MarkdownIt, mathOpts?: MathOptions) {
           const token = state.push('math_inline', 'math', 0)
           token.content = normalizeStandaloneBackslashT(content, mathOpts)
           token.markup = open === '$$' ? '$$' : open === '\\(' ? '\\(\\)' : open === '$' ? '$' : '()'
-
+          token.loading = false
           // we'll handle the trailing text after loop; but to preserve the
           // original behaviour when strong prefix was detected, mimic it here
           if (isStrongPrefix) {
@@ -369,9 +369,8 @@ export function applyMath(md: MarkdownIt, mathOpts?: MathOptions) {
     silent: boolean,
   ) => {
     const delimiters: [string, string][] = [
-      ['\\[', '\\]'],
+      ['\[', '\]'],
       ['$$', '$$'],
-      ['[', ']'],
     ]
 
     const startPos = state.bMarks[startLine] + state.tShift[startLine]