docs/javascripts/mathjax.js

@@ -1,3 +1,4 @@
+// mathjax-config.js (New file for configuration)
 window.MathJax = {
     tex: {
         inlineMath: [["\\(", "\\)"]],
@@ -8,9 +9,39 @@ window.MathJax = {
     options: {
         ignoreHtmlClass: ".*|",
         processHtmlClass: "arithmatex"
+    }, 
+    // Enable MathML output (refer to MathJax docs for customization)
+    mml: {
+        output: {
+            font: "mathjax" // Or any preferred font
+        }
+    },
+    startup: {
+        ready() {
+            MathJax.startup.defaultReady();
+            MathJax.Config({
+                showErrorMessages: true,
+            });
+        }
+    },
+    errorHandler: (errors) => {
+        console.error("MathJax encountered errors:", errors);
+        // Additional error handling to display user-friendly messages
     }
 };
 
-document$.subscribe(() => {
-    MathJax.typesetPromise()
-})
+// In your main JavaScript file (e.g., where you include MathJax)
+document$.subscribe(debounce(() => {
+    const mathElements = document.querySelectorAll('.arithmatex');
+    MathJax.typesetPromise(mathElements);
+}, 250)); 
+
+// Debounce function (You can use a library like Lodash or implement your own)
+function debounce(func, wait) {
+    let timeout;
+    return function() {
+        const context = this, args = arguments;
+        clearTimeout(timeout);
+        timeout = setTimeout(() => func.apply(context, args), wait);
+    };
+}