Investigate "flash-of-unstyled-content" (FOUC) and layout shift (LS) issues - Githubissues

CityOfDetroit / COD-Design-System

Design system for the City of Detroit.

https://cityofdetroit.github.io/COD-Design-System/

MIT License

1 stars 3 forks source link

Investigate "flash-of-unstyled-content" (FOUC) and layout shift (LS) issues #170

Open maxatdetroit opened 7 months ago

maxatdetroit commented 7 months ago

Is your feature request related to a problem? Please describe.

When storybook is loaded in production (link) there is a noticeable FOUC and LS for even minor components. It's likely this is further compounded when many components and more complex components are used in the wild (e.g. on detroitmi.gov).

Describe the solution you'd like

[ ] Investigate the severity of this problem with metrics where possible - web vital metrics like CLS being built in CityOfDetroit/detroitmi#1279 will be helpful for this
Prototype an array of solutions and investigate (ordered below from easiest to most invasive)
- [ ] #171
- [ ] #173
- [ ] #174

maxatdetroit commented 6 months ago

More investigation required to see how much of a problem this is and what is the priority.