perf: shrink web app bundle from 7.9 MB to 3.0 MB

[mashpie]

What

The web app is built into a single HTML file with all assets inlined, so every first load
and hard reload downloads everything. On our self-hosted instance that was 7.85 MB,
uncompressed, on each visit.

Two PNGs made up 5.9 MB of that:

Image	Before	After
LoginScreen.png	2764x1897, 2.5 MB	WebP, 1600px wide, 585 KB
PairingBuddy.png	1024x1024, 1.7 MB (rendered at 80px)	WebP, 256x256, 17 KB

Changes

• Convert both images to WebP at a size closer to how they are displayed.
• Enable encode zstd gzip in the bundled selfhost/Caddyfile. Neither the backend nor
  Caddy compressed responses.

Result

yarn workspace web-app build:

	Bundle	gzip
Before	7,852 kB	4,982 kB
After	3,018 kB	1,387 kB

No behaviour change. Checked that both images render in the built app; the Caddyfile
passes caddy validate.

If you would rather keep the login image at a higher resolution, I'm happy to adjust.

Summary by CodeRabbit

• Performance
  • Enabled Zstandard and gzip compression for the site’s responses.
  • Updated the dashboard and login artwork to WebP format.

[netlify]

✅ Deploy Preview for hoppdocs ready!

Name	Link
🔨 Latest commit	d3b8c35
🔍 Latest deploy log	https://app.netlify.com/projects/hoppdocs/deploys/6ac392000a76b9000882c440
😎 Deploy Preview	https://deploy-preview-389--hoppdocs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

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

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

🧰 Additional context used

📚 Code guidelines (1)

AGENTS.md — auto-discovered

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: 6584f400-afb2-499d-bc59-597bf709269a

📥 Commits

Reviewing files that changed from the base of the PR and between eb2468c and d3b8c35.

⛔ Files ignored due to path filters (2)

• web-app/src/assets/LoginScreen.png is excluded by !**/*.png
• web-app/src/assets/PairingBuddy.png is excluded by !**/*.png

📒 Files selected for processing (5)

• selfhost/Caddyfile
• web-app/src/assets/LoginScreen.webp
• web-app/src/assets/PairingBuddy.webp
• web-app/src/pages/Dashboard.tsx
• web-app/src/pages/Login.tsx

Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 3 remain after this review.

---

📝 Walkthrough

Walkthrough

The Caddy configuration now enables Zstandard and gzip for the domain site. Dashboard and Login import their artwork from WebP assets instead of PNG assets.

Changes

Web delivery updates

Layer / File(s)	Summary
Domain-site compression selfhost/Caddyfile	The {$DOMAIN} site enables Zstandard and gzip encoding.
WebP artwork imports web-app/src/pages/Dashboard.tsx, web-app/src/pages/Login.tsx	Dashboard and Login import artwork from WebP assets instead of PNG assets.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~5 minutes

Change: Refactor

Suggested reviewers: iparaskev

Merge Risk: ⚪ Minimal · up to d3b8c

The site can negotiate Zstandard or gzip, and both pages bundle their WebP artwork. No actionable merge-blocking issue is established.

Security Architecture Review

Security architecture risk: 🔵 Low · up to d3b8c

The artwork changes do not alter login or dashboard controls, and the proxy retains its existing destinations and exposed ports. Compression is enabled for the whole backend-facing site, however, not just the app HTML. No exploitable security regression was established, but deployed response behavior remains unverified.

Retained concerns
No architecture-level concerns identified.

Security review details

Security Blast Radius

• inferred — The configuration change affects responses delivered through the configured backend-facing domain. It does not extend encoding to the separate LiveKit site or change published ports, network destinations, or service privileges.

Trust Boundaries and Controls

• observed — The proxy continues forwarding to the same backend, and the inspected protected route group retains its JWT middleware. The page changes do not introduce attacker-supplied asset locations or new button actions.

Hardening Proposals

• proposed — If compression is intended only for static app delivery, consider restricting it accordingly. Otherwise, validate sensitive API responses for secret and attacker-controlled content co-compression before treating site-wide encoding as fully assessed. This is a precaution, not an observed vulnerability.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the main performance goal: reducing the web-app bundle size.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2…
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}