Skip to content

perf: cut initial bundle size by 44% - #320

Merged
MrYuion merged 1 commit into
developfrom
t3/reduce-initial-bundle
Oct 8, 2026
Merged

MrYuion merged 1 commit into
developfrom
t3/reduce-initial-bundle

Conversation

@MrYuion

@MrYuion MrYuion commented Oct 8, 2026

Copy link
Copy Markdown
Collaborator

Problem

The initial main bundle was 824.6 kB raw (194.9 kB transfer). Most of it was code start-up does not use: the Material/CDK overlay stack (snackbar, tooltip, dialog), the inlined en-AU locale (52 kB), @placeos/cloud-uploads, date-fns and a dead Sentry call.

Solution

  • Lazy snackbar. setNotifyOutlet also accepts a promise. Notifications made before the snackbar module loads open when it does.
  • @defer for the upload list, update toast and global banner. These were the only root-level users of tooltip, dialog, ripple and cloud uploads. The upload list loads on idle, so drag-and-drop uploads still work almost at once.
  • Standalone Material directives (MatTooltip, MatProgressBar, MatRipple) in root components, as @defer cannot defer NgModules.
  • Lazy en-AU fallback locale. LocaleService.ready resolves when it loads. Start-up always waits for it (same 5 s cap as before) before the shell renders.
  • date-fns out of start-up. The tenant expiry helper is imported only for sys-admins. The build-time debug log uses Intl.
  • Dead code removed. The Sentry withScope call did nothing (Sentry is never initialised). setToken had no callers. This also drops ts-md5 from main.
  • Removed the start-up syncUploadToken() call. Each upload already calls it.
Raw Transfer
main before 824.6 kB 194.9 kB
main after 461.6 kB 122.4 kB
Initial total 955 → 592 kB 210 → 137 kB

Testing

  • Unit tests and lint pass. Added a test for notifications made while the snackbar loads.
  • Ran the production build in mock mode: the app starts, translations show, the deferred upload list and banner render, and the "copy ID" notification opens. No console errors.

@sentry/browser is now unused and can be removed from package.json in a follow-up.

Changes made by Claude Opus 5.5 (1M context) in Claude Code, running in T3 Code.

🤖 Generated with Claude Code

The main bundle loaded Material overlay code, the en-AU locale, cloud
uploads and date-fns at start-up, though start-up does not use them.

- Load the snackbar lazily. Notifications made before it loads open
  when it does.
- Defer the upload list, update toast and global banner. Use standalone
  Material directives, as @defer cannot defer NgModules.
- Load the en-AU fallback locale as a lazy chunk. Start-up waits for it.
- Import the tenant expiry helper only for sys-admins. Format the
  build-time debug log with Intl.
- Remove the dead Sentry call and the unused setToken method.

main: 824.6 kB -> 461.6 kB raw, 194.9 kB -> 122.4 kB transfer.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@vercel

vercel Bot commented Oct 8, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
backoffice Ready Ready Preview Oct 8, 2026 7:26am UTC

@MrYuion
MrYuion merged commit ab49e71 into develop Oct 8, 2026
6 of 8 checks passed
@MrYuion
MrYuion deleted the t3/reduce-initial-bundle branch October 8, 2026 08:17

This branch was successfully deployed

1 active deployment
Preview — dd8ab504 Deployed Oct 8, 2026 by vercel[bot]
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