aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPaul Duncan <pabs@pablotron.org>2022-03-05 13:14:02 -0500
committerPaul Duncan <pabs@pablotron.org>2022-03-05 13:14:02 -0500
commit14d3556bd548c50f8dcbe519c85a3a8eb3c079ae (patch)
treec7309d74dfcdb7179f8eddb383da06dbc106fcdc
parente2c16034dee1879d7b05ac057d7375d29a2033a7 (diff)
downloadpablotron.org-14d3556bd548c50f8dcbe519c85a3a8eb3c079ae.tar.bz2
pablotron.org-14d3556bd548c50f8dcbe519c85a3a8eb3c079ae.zip
themes/hugo-pt2021/assets/scripts.js: shrink unminified js by 27 bytes (~8.8%)
-rw-r--r--themes/hugo-pt2021/assets/script.js23
1 files changed, 21 insertions, 2 deletions
diff --git a/themes/hugo-pt2021/assets/script.js b/themes/hugo-pt2021/assets/script.js
index bc95b27..2805cef 100644
--- a/themes/hugo-pt2021/assets/script.js
+++ b/themes/hugo-pt2021/assets/script.js
@@ -1,12 +1,31 @@
// enable burger menu support
// src: https://bulma.io/documentation/components/navbar/
+//
+// Note (2022-03-05): I initially switched from Array.prototype.slice()
+// to Array.from() and added "const D = document;" to shrink the
+// minified, uncompressed code from 307 bytes to 292 bytes for a ~4.9%
+// (15 bytes) size reduction.
+//
+// Then, I dropped Array.from() entirely, since all modern browsers (see
+// URL below) support NodeList.forEach().
+//
+// Ref: https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach
+//
+// This shrunk the minified, uncompressed size to 280 bytes, for a
+// ~8.8% (27 bytes) cumulative size reduction.
+//
+// I also tried switching from forEach to for..of, but that increased
+// the minified, uncompressed size by a two bytes.
+//
document.addEventListener('DOMContentLoaded', () => {
"use strict";
+ const D = document;
+
// iterate through burgers
- Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0).forEach(e => {
+ D.querySelectorAll('.navbar-burger').forEach(e => {
e.addEventListener('click', () => {
// get target from data-target attribute
- const t = document.getElementById(e.dataset.target);
+ const t = D.getElementById(e.dataset.target);
// toggle is-active on both burger and menu
[e, t].forEach(e => e.classList.toggle('is-active'));