Skip to content

Commit

Permalink
Load mermaid asynchronously
Browse files Browse the repository at this point in the history
If mermaid is synchronously loaded, a slow load can prevent the sidebar
from displaying since it loads async and must wait for mermaid. Instead,
load mermaid asynchronously and then call `mermaidLoaded()` when loading
is finished.
  • Loading branch information
voughtdq authored and garazdawi committed Aug 20, 2024
1 parent cfcc648 commit 1546273
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions make/ex_doc.exs
Original file line number Diff line number Diff line change
Expand Up @@ -187,9 +187,8 @@ config = [
before_closing_body_tag: fn
:html ->
"""
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function () {
function mermaidLoaded() {
mermaid.initialize({
startOnLoad: false,
theme: document.body.className.includes("dark") ? "dark" : "default"
Expand All @@ -207,8 +206,9 @@ config = [
preEl.remove();
});
}
});
}
</script>
<script async src="https://cdn.jsdelivr.net/npm/[email protected]/dist/mermaid.min.js" onload="mermaidLoaded();"></script>
"""

_ ->
Expand Down

0 comments on commit 1546273

Please sign in to comment.