Experiment with ways to improve INP score for some pages (new Core Web Vitals metric)
6000a6ac : Adding fetchpriority=high to Home Hero Poster
4fe01beb : Switching out Webinar videos embed to YouTube Lite
256e6a21 : Adding image dimensions to webinar icons
3f153ddc : Dequeue Search Filter styles on singular webinars
1d1fb5bf : Adding loading lazy to Gallery Slider block
2f5e22f0 : Removing Search Filter styles on Posts archive pages
7f30b087 : Make large featured image on blog to be eager loading
32989a75 : Remove Search Filter CSS from singular posts
127dc683 : Add image dimensions to webinar recorded item
4e697b69 : Add lazy loading to webinar recorded item
ed96ee54 : Adding accessibility markup to Events Map
378187d5 : Optimize map marker SVGs
3855a725 : Adding image dimensions to Members logos shortcode
92228eac : Changing H3 heading in training shortcode so Headings in sequential order
cae96ea3 : Adding image dimensions to KTP item
ab2f32d5 : Merging events styles, adding content visibility to home page banner
fcd94d21 : Adding content-visibility to project logos slider
95e2c518 : Adding width and height to project logos shortcode
cec319de : Adding lazy load filter via wp_omit_loading_attr_threshold
For INP, this PR includes some experimentation with "content-visibility" which is essentially a content lazy loader. This is not supported by Safari, but should work in Chrome. Things to watch for with it are scrolling issues as the content loads, anchor links not working as they should (although I've only implemented on home page so the only relevant anchor link should #newsletter on the home)
cjyabraham
commented
1 year ago
Multiple commits around performance of various elements of the site
Related to #724
Test site: https://pr-758-cncfci.pantheonsite.io
Objectives:
6000a6ac : Adding fetchpriority=high to Home Hero Poster 4fe01beb : Switching out Webinar videos embed to YouTube Lite 256e6a21 : Adding image dimensions to webinar icons 3f153ddc : Dequeue Search Filter styles on singular webinars 1d1fb5bf : Adding loading lazy to Gallery Slider block 2f5e22f0 : Removing Search Filter styles on Posts archive pages 7f30b087 : Make large featured image on blog to be eager loading 32989a75 : Remove Search Filter CSS from singular posts 127dc683 : Add image dimensions to webinar recorded item 4e697b69 : Add lazy loading to webinar recorded item ed96ee54 : Adding accessibility markup to Events Map 378187d5 : Optimize map marker SVGs 3855a725 : Adding image dimensions to Members logos shortcode 92228eac : Changing H3 heading in training shortcode so Headings in sequential order cae96ea3 : Adding image dimensions to KTP item ab2f32d5 : Merging events styles, adding content visibility to home page banner fcd94d21 : Adding content-visibility to project logos slider 95e2c518 : Adding width and height to project logos shortcode cec319de : Adding lazy load filter via wp_omit_loading_attr_threshold
For INP, this PR includes some experimentation with "content-visibility" which is essentially a content lazy loader. This is not supported by Safari, but should work in Chrome. Things to watch for with it are scrolling issues as the content loads, anchor links not working as they should (although I've only implemented on home page so the only relevant anchor link should #newsletter on the home)