Recaptcha recommends loading of its script like this:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
I added this to the head section of the html document and checked with Chrome when it is loaded. Chrome says it is loaded before page load (the network tab of chrome devtools indicates the end of the page load with a vertical red line and the above script is loaded before that.
Why is that? Shouldn't adding async defer as recommended by google defer loading of the script after page load?
The page is only fully loaded when all linked resources (including
<script async defer) have loaded. This is when the
onload event fires.
DOMContentLoaded event is likely to fire before this - which will probably be before the
async defer scripts have loaded. (I say "probably" - if the browser is able to determine that it can load the script in another thread at the same time without slowing things down then I guess it probably will; but with no guarantee.)