preconnect; when your site has resources loaded from 3rd party servers and the connection for those does not happen immediately and takes to long, you can add the domain (incl. https:///) there
preload; if google pagespeed insights advises to preload resources you can do so here
async: if you have render-blocking JS (local or 3rd party) which is render-blocking, you can try adding (part of) the URL for those JS-files here.
hope this clarifies,
frank
for case no.1
can i add the below mentioned link in the pre connect box
https://www.gstatic.com/firebasejs/7.21.0/firebase-app.js
https://www.gstatic.com/firebasejs/7.21.0/firebase-auth.js
and also links related with google recaptcha and google analytics
case no.2 google page insight has asked to preload some datas
Preload key requests1.82 s
Consider using <link rel=preload> to prioritize fetching resources that are currently requested later in page load. Learn more.
some urls
https://www.xyz.com/wp-content/themes/oceanwp/assets/fonts/star/star.woff
https://www.xyz.com/wp-content/plugins/ti-woocommerce-wishlist/assets/fonts/tinvwl-webfont.ttf?xu2uyi
from the above two ex what are the contents that i must paste in the pre request box
for case no. 3 render blocking
https://www.xyz.com/wp-content/cache/autoptimize/css/autoptimize_29a769c537296aab601af0460abb7e45.css
for case 1: you can try adding https://www.gstatic.com and test if it improves performance
for case 2: you can try adding https://www.xyz.com/wp-content/themes/oceanwp/assets/fonts/star/star.woff, https://www.xyz.com/wp-content/plugins/ti-woocommerce-wishlist/assets/fonts/tinvwl-webfont.ttf?xu2uyi and test if it improves performance
for case 3: no, because async works for JS, not CSS. consider trying “inline & defer CSS” instead (see AO FAQ for more info)
