diff --git a/layouts/shortcodes/bergamot_js_css.html b/layouts/shortcodes/bergamot_js_css.html
index 0cefd24..0e9127d 100644
--- a/layouts/shortcodes/bergamot_js_css.html
+++ b/layouts/shortcodes/bergamot_js_css.html
@@ -1,7 +1,7 @@
-<script src="{{ .Site.Params.bergamotJsUrl }}"></script>
+<script defer src="{{ .Site.Params.bergamotJsUrl }}"></script>
 {{ $style := resources.Get "scss/bergamot.scss" | resources.ToCSS | resources.Minify }}
 <link rel="stylesheet" href="{{ $style.Permalink }}">
-<script>
+<script defer>
 const renderRules =
     `
     PrecApp @ prec(app(?l, ?r), 100, left) <-;
diff --git a/layouts/shortcodes/bergamot_widget.html b/layouts/shortcodes/bergamot_widget.html
index 9359fd5..d4e9a31 100644
--- a/layouts/shortcodes/bergamot_widget.html
+++ b/layouts/shortcodes/bergamot_widget.html
@@ -1,4 +1,6 @@
 <div id="{{ .Get "id" }}"></div>
 <script>
-    window.Bergamot.run(null, '{{ .Get "id" }}', '{{ .Get "prompt" }}', '{{ .Inner }}', renderRules, '{{ .Get "query" }}');
+    window.addEventListener('load', function() {
+        window.Bergamot.run(null, '{{ .Get "id" }}', '{{ .Get "prompt" }}', '{{ .Inner }}', renderRules, '{{ .Get "query" }}');
+    });
 </script>
diff --git a/layouts/shortcodes/katex_component_js.html b/layouts/shortcodes/katex_component_js.html
index 5463f7d..c19cd41 100644
--- a/layouts/shortcodes/katex_component_js.html
+++ b/layouts/shortcodes/katex_component_js.html
@@ -1,4 +1,4 @@
-<script src="{{ .Site.Params.katexJsUrl }}" crossorigin="anonymous"></script>
+<script defer src="{{ .Site.Params.katexJsUrl }}" crossorigin="anonymous"></script>
 <script defer>
 class KatexExpressionShim extends HTMLElement {
     static observedAttributes = ["expression", "katex-options"];