I have not been used in the script over other property, to see the underlying code today, only to find this, search records to memory.
As we all know, js load will cause obstruction, hindering continue rendering the page.
defer:
js sync with the page loads, not hinder page rendering, will perform js after page rendering is complete.
async:
js sync with the page loads, not hinder rendering the page, but will be performed immediately after js loaded, then will cause obstruction, know js execution is completed to continue rendering the page.
The figure comes from the network, it can be a good description of these two differences:
Blue line represents the network read, the red line represents the execution time, maybe for all of the script, the green line represents the HTML parsing.