Custom Scripts
Javascript here modifies mdbook or extends mdbook to allow a better site viewing experience.
Mermaid
Mermaid lazyload
Lighthouse penalizes pages based on first content paint times.
Mermaid comes with a large binary, ~3MB: mermaid-11.15.0.min.js.
This script is put into the render blocking path. The big mermaid file is only loaded on pages with Mermaid.
Connected to:
mermaid-11.15.0.min.jssvg-zoomer.js
SVG zoomer
There are some very large diagrams on this site.
SVGs and Mermaid diagrams can’t be zoom’d natively on desktop. This script creates a fullscreen pan/zoom viewer.
- Desktop only: on mobile the browser’s own pinch-to-zoom already works; this script is disabled.
- Self-contained (Pointer Events), no libraries
Connected to:
mermaid-lazyload.js
Zoom unstick
On touch devices a sticky menu bar rides along magnified during pinch-zoom, covering the content being zoomed. This tags <html> with pinch-zoomed while zoomed in so the menu bar unsticks, then restores it when zoomed back out.
- Uses
visualViewportscale, no libraries - Keeps the search button reachable at normal zoom
SEO
This site doesn’t do great on Bing.
Stamp page mtimes
Necessary for accurate dates on pages before submitting with IndexNow.
This is run right before build.
Use-ability
Things to make the notes experience nicer.
Editable extras
- Extends mdBook’s editable code block behavior after
book.jsruns- Adds undo controls for editable non-Rust examples
- Uses code fences:
```text,editable