Debounce mathjax rendering to avoid stalling (#3827)

* move change-timer to editable

* debounce mathjax rendering
This commit is contained in:
llama 2025-02-21 17:39:11 +08:00 committed by GitHub
parent e373b0ed9b
commit 8ec139f62a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 10 additions and 4 deletions

View file

@ -38,25 +38,31 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import { pageTheme } from "$lib/sveltelib/theme";
import { convertMathjax, unescapeSomeEntities } from "./mathjax";
import { ChangeTimer } from "./change-timer";
export let mathjax: string;
export let block: boolean;
export let fontSize: number;
let converted: string, title: string;
const debouncedMathjax = writable(mathjax);
const debouncer = new ChangeTimer();
$: debouncer.schedule(() => debouncedMathjax.set(mathjax), 500);
$: {
const cache = getCache($pageTheme.isDark, fontSize);
const entry = cache.get(mathjax);
const entry = cache.get($debouncedMathjax);
if (entry) {
[converted, title] = entry;
} else {
const entry = convertMathjax(
unescapeSomeEntities(mathjax),
unescapeSomeEntities($debouncedMathjax),
$pageTheme.isDark,
fontSize,
);
[converted, title] = entry;
cache.set(mathjax, entry);
cache.set($debouncedMathjax, entry);
}
}
$: empty = title === "MathJax";

View file

@ -57,7 +57,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
type ImageLoadedEvent,
resetIOImage,
} from "../routes/image-occlusion/mask-editor";
import { ChangeTimer } from "./change-timer";
import { ChangeTimer } from "../editable/change-timer";
import { clearableArray } from "./destroyable";
import DuplicateLink from "./DuplicateLink.svelte";
import EditorToolbar from "./editor-toolbar";