Improve CLS caused by mobile menu - Githubissues

studiopress / genesis-sample

This is the sample theme created for the Genesis Framework.

https://demo.studiopress.com/genesis-sample/

528 stars 285 forks source link

Improve CLS caused by mobile menu #371

Closed dreamwhisper closed 3 years ago

dreamwhisper commented 3 years ago

Implements no-js/js solution to prevent Content Layout Shift (CLS) caused by the mobile menu.

Closes #307

How to test

Test with Genesis 3.3.3 and this branch. It will be helpful to have a live site for testing.
Set up a multi-level menu.
Run some tests with Chrome dev tools, https://developers.google.com/speed/pagespeed/insights/ and https://web.dev/measure/

Documentation

No documentation required.

Suggested changelog entry

Fixed: Content Layout Shift (CLS) caused by the mobile menu.

Notes

Also tested with AMP enabled.

jtwillia2 commented 3 years ago

Would this work on the Magazine Pro theme as well?