fix(webapp): keep PNG palettes through sharp minification (dist 79MB -> ~56MB) #29

Merged
mohlec merged 1 commit from fix/png-palette into slash/main 2026-09-01 17:41:09 +00:00
Owner

Upstream v11.7.10 replaced image-webpack-loader with image-minimizer-webpack-plugin using sharpMinify and empty PNG encode options (png: {}). sharp defaults to truecolor output, so paletted PNGs are re-encoded as RGBA and get dramatically larger.

Measured by comparing the two CI dist artifacts on the git server:

pre-merge 20260805 post-merge 20260901
emoji-sheets/apple-sheet.png 3828x3828, 8-bit colormap4.87 MB 3828x3828, 8-bit/color RGBA23.58 MB
dist/emoji/* (~1,800 files) ~10 KB each ~13.6 KB each (+35%)
dist/files total 11.1 MB 30.6 MB
dist/emoji total 17.8 MB 22.9 MB
whole dist tarball 56.5 MB 79.5 MB

The emoji sprite sheet ships to every client that opens the emoji picker, so this is a real cost for subscribers on rural wireless links.

Note upstream already excludes GIFs from sharp for the same class of problem ("animated GIFs lose frames or grow in size when re-encoded by sharp") — PNGs just never got the equivalent guard.

The change

png: {palette: true},

webapp/channels/webpack.config.js is already a diverged file, so this adds no new entry to DIVERGENCE.md — only widens the existing row's note so the next merge keeps the option.

Verification

build-webapp must produce apple-sheet back at ~4.9 MB and a dist tarball near 56 MB. Since build-webapp does not run on pull requests, that check happens after this merges — or via workflow_dispatch.

This is very likely an upstream bug affecting all 11.7.10 builds and worth reporting to mattermost.

Upstream v11.7.10 replaced `image-webpack-loader` with `image-minimizer-webpack-plugin` using `sharpMinify` and empty PNG encode options (`png: {}`). sharp defaults to truecolor output, so **paletted PNGs are re-encoded as RGBA** and get dramatically larger. Measured by comparing the two CI dist artifacts on the git server: | | pre-merge `20260805` | post-merge `20260901` | |---|---|---| | `emoji-sheets/apple-sheet.png` | `3828x3828, 8-bit colormap` — **4.87 MB** | `3828x3828, 8-bit/color RGBA` — **23.58 MB** | | `dist/emoji/*` (~1,800 files) | ~10 KB each | ~13.6 KB each (+35%) | | `dist/files` total | 11.1 MB | 30.6 MB | | `dist/emoji` total | 17.8 MB | 22.9 MB | | **whole dist tarball** | **56.5 MB** | **79.5 MB** | The emoji sprite sheet ships to every client that opens the emoji picker, so this is a real cost for subscribers on rural wireless links. Note upstream already excludes GIFs from sharp for the same class of problem ("animated GIFs lose frames or grow in size when re-encoded by sharp") — PNGs just never got the equivalent guard. ## The change ```js png: {palette: true}, ``` `webapp/channels/webpack.config.js` is already a diverged file, so this adds no new entry to `DIVERGENCE.md` — only widens the existing row's note so the next merge keeps the option. ## Verification `build-webapp` must produce `apple-sheet` back at ~4.9 MB and a dist tarball near 56 MB. Since `build-webapp` does not run on pull requests, that check happens after this merges — or via `workflow_dispatch`. This is very likely an upstream bug affecting all 11.7.10 builds and worth reporting to mattermost.
fix(webapp): keep PNG palettes through sharp minification
All checks were successful
Build Slash Webapp / branding-audit (pull_request) Successful in 46s
Build Slash Webapp / build-webapp (pull_request) Has been skipped
398324aefa
Upstream v11.7.10 replaced image-webpack-loader with image-minimizer-webpack-plugin using sharpMinify and empty png encode options. sharp defaults to truecolor, so paletted PNGs are re-encoded as RGBA: emoji-sheets/apple-sheet.png went 4.87MB -> 23.58MB (3828x3828, 8-bit colormap -> 8-bit RGBA) and each individual emoji PNG grew ~35%. Total dist went 56MB -> 79MB.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
mohlec merged commit 4951908bf1 into slash/main 2026-09-01 17:41:09 +00:00
mohlec deleted branch fix/png-palette 2026-09-01 17:41:09 +00:00
Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
slash/slash-server!29
No description provided.