Skip to content

Stop loading unused CSS and JavaScript on every page - #206

Open
bendichter wants to merge 10 commits into
mainfrom
page-weight
Open

bendichter wants to merge 10 commits into
mainfrom
page-weight

Conversation

@bendichter

Copy link
Copy Markdown
Contributor

Combines four small PRs that each remove something every page loads but does not need. Each one is a separate merge commit, so they can be reviewed one at a time.

  • Load the Bootstrap stylesheet once (#189): head.html compiled and linked plugins.scss twice. The first copy had no effect on rendering, and removing it takes a 280 KB render-blocking stylesheet off every page.
  • Replace Font Awesome with Bootstrap Icons (#191): the 16 Font Awesome icons on the events, FAQ and Supporting NWB pages now use the matching Bootstrap Icons, and the Font Awesome stylesheet and its 156 KB font file are dropped. The glyphs are close but not identical, and the fallback icon on Supporting NWB (currently only MICrONS) changes from a brain to a network diagram.
  • Load Swiper only on the home page (#192): the Swiper stylesheet and script (48 KB compressed) are included only on the home page, the only page with carousels.
  • Check that the Team page buttons exist before attaching handlers (#187): fixes the TypeError that main.js logged on every page except Team.

Most of the main.js diff is re-indentation, so it is easier to read with whitespace hidden.

The combined branch builds with Hugo 0.152.2 and produces the same 165 pages as main.

Supersedes #187, #189, #191 and #192.

🤖 Generated with Claude Code

bendichter and others added 10 commits October 9, 2026 12:51
main.js attached the "show more" and "show less" handlers without checking that the buttons exist. They are only rendered on the Team page, and only when a group has more than eight members, so the script threw a TypeError on every other page. Most of the diff is re-indentation.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
head.html compiled plugins.scss twice and linked both results: an unminified copy before style.css and a minified copy after it. The second copy repeats every rule of the first later in the cascade, so the first had no effect on rendering. This removes it, which drops a 280 KB render-blocking stylesheet from every page.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Every page loaded both icon fonts, and Font Awesome was used for 16 icons on the events, FAQ and Supporting NWB pages. Those now use the equivalent Bootstrap Icons, so the Font Awesome stylesheet (and its 156 KB font on the pages that used it) is no longer loaded. Bootstrap Icons has no brain icon, so the fallback for an activity without a logo on Supporting NWB uses a network diagram instead.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The Swiper stylesheet and script (48 KB compressed) were loaded on every page, and only the home page has carousels. They are now included only there, and main.js checks that the library is present before creating the carousels.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
# Conflicts:
#	layouts/partials/essentials/head.html
…me-only

# Conflicts:
#	layouts/partials/essentials/head.html
@netlify

netlify Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for nwborg ready!

Name Link
🔨 Latest commit 53bf3bc
🔍 Latest deploy log https://app.netlify.com/projects/nwborg/deploys/6acbcadb9008ec0008a8a6eb
😎 Deploy Preview https://deploy-preview-206--nwborg.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@bendichter

Copy link
Copy Markdown
Contributor Author

Before and after

"Before" is the production site and "after" is this PR's Netlify deploy preview, both at 1440 px wide.

Events page: the calendar, map pin and tag icons are now Bootstrap Icons

Before After
before after

Supporting NWB: the fallback icon for MICrONS changes from a brain to a network diagram

Before After
before after

The other changes are not visible on the page. The addEventListener error that production logs in the console on these pages does not appear on the preview.

🤖 Generated with Claude Code

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant