docs: use defer when possible for JS

This commit is contained in:
XhmikosR 2024-03-08 12:53:43 +02:00
parent 6922f5d9cb
commit 45fe28c5a6
12 changed files with 20 additions and 10 deletions

View File

@ -41,7 +41,7 @@ const openBootstrapSnippet = (htmlSnippet, jsSnippet, classes) => {
<link href="${cssCdn}" rel="stylesheet"> <link href="${cssCdn}" rel="stylesheet">
<link href="https://getbootstrap.com/docs/${docsVersion}/assets/css/docs.css" rel="stylesheet"> <link href="https://getbootstrap.com/docs/${docsVersion}/assets/css/docs.css" rel="stylesheet">
<title>Bootstrap Example</title> <title>Bootstrap Example</title>
<${'script'} src="${jsBundleCdn}"></${'script'}> <${'script'} defer src="${jsBundleCdn}"></${'script'}>
</head> </head>
<body class="p-3 m-0 border-0 ${classes}"> <body class="p-3 m-0 border-0 ${classes}">
<!-- Example Code Start--> <!-- Example Code Start-->

View File

@ -5,6 +5,7 @@ extra_css:
- "../cheatsheet/cheatsheet.rtl.css" - "../cheatsheet/cheatsheet.rtl.css"
extra_js: extra_js:
- src: "../cheatsheet/cheatsheet.js" - src: "../cheatsheet/cheatsheet.js"
defer: true
body_class: "bg-body-tertiary" body_class: "bg-body-tertiary"
direction: rtl direction: rtl
--- ---

View File

@ -5,6 +5,7 @@ extra_css:
- "cheatsheet.css" - "cheatsheet.css"
extra_js: extra_js:
- src: "cheatsheet.js" - src: "cheatsheet.js"
defer: true
body_class: "bg-body-tertiary" body_class: "bg-body-tertiary"
--- ---

View File

@ -6,6 +6,7 @@ extra_css:
- "../checkout/checkout.css" - "../checkout/checkout.css"
extra_js: extra_js:
- src: "../checkout/checkout.js" - src: "../checkout/checkout.js"
defer: true
body_class: "bg-body-tertiary" body_class: "bg-body-tertiary"
--- ---

View File

@ -5,6 +5,7 @@ extra_css:
- "checkout.css" - "checkout.css"
extra_js: extra_js:
- src: "checkout.js" - src: "checkout.js"
defer: true
body_class: "bg-body-tertiary" body_class: "bg-body-tertiary"
--- ---

View File

@ -7,7 +7,9 @@ extra_css:
extra_js: extra_js:
- src: "https://cdn.jsdelivr.net/npm/chart.js@4.3.2/dist/chart.umd.js" - src: "https://cdn.jsdelivr.net/npm/chart.js@4.3.2/dist/chart.umd.js"
integrity: "sha384-eI7PSr3L1XLISH8JdDII5YN/njoSsxfbrkCTnJrzXt+ENP5MOVBxD+l6sEG4zoLp" integrity: "sha384-eI7PSr3L1XLISH8JdDII5YN/njoSsxfbrkCTnJrzXt+ENP5MOVBxD+l6sEG4zoLp"
defer: true
- src: "dashboard.js" - src: "dashboard.js"
defer: true
--- ---
<svg xmlns="http://www.w3.org/2000/svg" class="d-none"> <svg xmlns="http://www.w3.org/2000/svg" class="d-none">

View File

@ -6,7 +6,9 @@ extra_css:
extra_js: extra_js:
- src: "https://cdn.jsdelivr.net/npm/chart.js@4.3.2/dist/chart.umd.js" - src: "https://cdn.jsdelivr.net/npm/chart.js@4.3.2/dist/chart.umd.js"
integrity: "sha384-eI7PSr3L1XLISH8JdDII5YN/njoSsxfbrkCTnJrzXt+ENP5MOVBxD+l6sEG4zoLp" integrity: "sha384-eI7PSr3L1XLISH8JdDII5YN/njoSsxfbrkCTnJrzXt+ENP5MOVBxD+l6sEG4zoLp"
defer: true
- src: "dashboard.js" - src: "dashboard.js"
defer: true
--- ---
<svg xmlns="http://www.w3.org/2000/svg" class="d-none"> <svg xmlns="http://www.w3.org/2000/svg" class="d-none">

View File

@ -5,6 +5,7 @@ extra_css:
- "offcanvas-navbar.css" - "offcanvas-navbar.css"
extra_js: extra_js:
- src: "offcanvas-navbar.js" - src: "offcanvas-navbar.js"
defer: true
body_class: "bg-body-tertiary" body_class: "bg-body-tertiary"
aliases: "/docs/5.3/examples/offcanvas/" aliases: "/docs/5.3/examples/offcanvas/"
--- ---

View File

@ -5,6 +5,7 @@ extra_css:
- "sidebars.css" - "sidebars.css"
extra_js: extra_js:
- src: "sidebars.js" - src: "sidebars.js"
defer: true
body_class: "" body_class: ""
--- ---

View File

@ -67,7 +67,7 @@
{{ end }} {{ end }}
{{ define "footer" }} {{ define "footer" }}
{{ range .Page.Params.extra_js -}} {{ range .Page.Params.extra_js -}}
<script{{ with .async }} async{{ end }} src="{{ .src }}"></script> <script{{ with .async }} async{{ end }}{{ with .defer }} defer{{ end }} src="{{ .src }}"></script>
{{- end -}} {{- end -}}
<div class="position-fixed" aria-hidden="true"><input type="text" tabindex="-1"></div> <div class="position-fixed" aria-hidden="true"><input type="text" tabindex="-1"></div>
{{ end }} {{ end }}

View File

@ -159,13 +159,13 @@
{{ .Content }} {{ .Content }}
{{- if hugo.IsProduction -}} {{- if hugo.IsProduction -}}
<script src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.min.js" {{ printf "integrity=%q" .Site.Params.cdn.js_bundle_hash | safeHTMLAttr }}></script> <script defer src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.min.js" {{ printf "integrity=%q" .Site.Params.cdn.js_bundle_hash | safeHTMLAttr }}></script>
{{- else -}} {{- else -}}
<script src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.js"></script> <script defer src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.js"></script>
{{- end }} {{- end }}
{{ range .Page.Params.extra_js -}} {{ range .Page.Params.extra_js -}}
<script{{ with .async }} async{{ end }} src="{{ .src }}"{{ with .integrity }} {{ printf "integrity=%q" . | safeHTMLAttr }} crossorigin="anonymous"{{ end }}></script> <script{{ with .async }} async{{ end }}{{ with .defer }} defer{{ end }} src="{{ .src }}"{{ with .integrity }} {{ printf "integrity=%q" . | safeHTMLAttr }} crossorigin="anonymous"{{ end }}></script>
{{- end -}} {{- end -}}
</body> </body>
</html> </html>

View File

@ -1,7 +1,7 @@
{{ if hugo.IsProduction -}} {{ if hugo.IsProduction -}}
<script src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.min.js" {{ printf "integrity=%q" .Site.Params.cdn.js_bundle_hash | safeHTMLAttr }}></script> <script defer src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.min.js" {{ printf "integrity=%q" .Site.Params.cdn.js_bundle_hash | safeHTMLAttr }}></script>
{{ else -}} {{ else -}}
<script src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.js"></script> <script defer src="/docs/{{ .Site.Params.docs_version }}/dist/js/bootstrap.bundle.js"></script>
{{- end }} {{- end }}
{{- $esbuildOptions := dict "target" "es2019" -}} {{- $esbuildOptions := dict "target" "es2019" -}}
@ -12,11 +12,11 @@
{{- end }} {{- end }}
{{- $applicationJs := resources.Get "js/application.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/application.js") }} {{- $applicationJs := resources.Get "js/application.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/application.js") }}
<script src="{{ $applicationJs.RelPermalink }}"></script> <script defer src="{{ $applicationJs.RelPermalink }}"></script>
{{- if (ne .Page.Layout "examples") -}} {{- if (ne .Page.Layout "examples") -}}
{{- $searchJs := resources.Get "js/search.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/search.js") }} {{- $searchJs := resources.Get "js/search.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/search.js") }}
<script async src="{{ $searchJs.RelPermalink }}"></script> <script defer src="{{ $searchJs.RelPermalink }}"></script>
{{- end -}} {{- end -}}
{{ if eq .Page.Layout "docs" -}} {{ if eq .Page.Layout "docs" -}}
@ -30,5 +30,5 @@
-}} -}}
{{- $esbuildOptions = merge $esbuildOptions (dict "params" $esbuildParams) -}} {{- $esbuildOptions = merge $esbuildOptions (dict "params" $esbuildParams) -}}
{{- $stackblitzJs := resources.Get "js/stackblitz.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/stackblitz.js") }} {{- $stackblitzJs := resources.Get "js/stackblitz.js" | js.Build $esbuildOptions | resources.Copy (path.Join $targetDocsJSPath "/assets/js/stackblitz.js") }}
<script async src="{{ $stackblitzJs.RelPermalink }}"></script> <script defer src="{{ $stackblitzJs.RelPermalink }}"></script>
{{- end -}} {{- end -}}