Is your enhancement related to a problem? Please describe.
One important consideration for ensuring well-performing and healthy Core Web Vitals is ensuring all pages are eligible for back-forward cache.
When a user clicks on the "Back" and "Forward" buttons in a browser, the page should load almost instantly.
Certain JS events and methods can invalidate this level of browser caching, which can negatively affect Core Web Vital data. The use of "back" and "forward" buttons by a user counts as a page view, so if the page does not load instantly, it is viable that on these "events," we could see poor Core Web Vital performance.
As such, there are a few considerations we need to take into account when adding functionality to wp-scaffold as well as building client websites on top of it.
This can be done in Google Chromes DevTools: Application -> Cache -> Back/Forward Cache
During development, and from time to time, we should run the back/forward cache check in DevTools to make sure we arent bringing down Core Web Vital scores unintentionally.
Designs
N/A
Describe alternatives you've considered
N/A
Code of Conduct
[X] I agree to follow this project's Code of Conduct
Is your enhancement related to a problem? Please describe.
One important consideration for ensuring well-performing and healthy Core Web Vitals is ensuring all pages are eligible for back-forward cache.
When a user clicks on the "Back" and "Forward" buttons in a browser, the page should load almost instantly.
Certain JS events and methods can invalidate this level of browser caching, which can negatively affect Core Web Vital data. The use of "back" and "forward" buttons by a user counts as a page view, so if the page does not load instantly, it is viable that on these "events," we could see poor Core Web Vital performance.
As such, there are a few considerations we need to take into account when adding functionality to wp-scaffold as well as building client websites on top of it.
unload
event: https://web.dev/bfcache/#never-use-the-unload-eventCache-Control: no-store
: https://web.dev/bfcache/#minimize-use-of-cache-control-no-storewindow.open
: https://web.dev/bfcache/#avoid-windowopener-referencesIndexedDB
,fetch
,XMLHTTPRequest
,WebSockets
,WebRTC
make sure to close connections after the work is done: https://web.dev/bfcache/#always-close-open-connections-before-the-user-navigates-awayValidating Back/Forward Cache
This can be done in Google Chromes DevTools: Application -> Cache -> Back/Forward Cache
During development, and from time to time, we should run the back/forward cache check in DevTools to make sure we arent bringing down Core Web Vital scores unintentionally.
Designs
N/A
Describe alternatives you've considered
N/A
Code of Conduct