⚡️(frontend) avoid inlining ProConnect SVG assets and optimize SVG size

Browse Source

Following the ProConnect documentation leads to inlining almost 40ko of
SVG assets in the JS bundle. Moreover, each SVG asset (around 20ko) is
not optimized in size.

As the ProConnect button is loaded in the main index.js chunk at app
launch, these few Ko are critical.

Optimize index.js by 40ko and preload the hovered variant to avoid any
blink on hover.

Could be further optimized by handling the button background with CSS,
but leaving that as an improvement for later.

...

This commit is contained in:

lebaudantoine

2026-05-25 12:37:30 +02:00

committed by aleb_the_flash

parent 4d27f217fc

commit 7c4f66f91e

3 changed files with 4 additions and 4 deletions

Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL

Download Patch File Download Diff File Expand all files Collapse all files

src/frontend/public/assets/proconnect-button-hovered.svg

+1

File diff suppressed because one or more lines are too long

Side by Side After Width:  |  Height:  |  Size: 12 KiB

src/frontend/public/assets/proconnect-button.svg

+1

File diff suppressed because one or more lines are too long

Side by Side After Width:  |  Height:  |  Size: 12 KiB

src/frontend/src/components/ProConnectButton.tsx

+2 -4

File diff suppressed because one or more lines are too long