WP_Scripts: output script element only if src not empty

[niallkennedy]

I was able to make async JavaScript loading work with existing WordPress code by acting on the script_loader_src filter before the <script> element is output, returning an empty string. This results in an empty src attribute, creating technically invalid HTML while not immediately loading the external script. If the WordPress code could check if a non-empty $src string exists before outputting I could avoid the invalid HTML nag. Attached diff only outputs the <script src=""> element if $src is not an empty string.

I'd like to be able to asynchronously load an enqueued script without needing to completely rework WP_Scripts. I'd like to take advantage of common handles indicating a script is set to be loaded, extra data attached to a handle, and other WordPress script expectations while swapping out the <script src=""> echoed markup.

Why async? A script steps out of the way, offering progressive enhancement of the page or loading non-critical features such as stats or socal network sharing buttons. Async loading also helps prevent single points of failure in webpage loading caused by China blocking Facebook or resources hosted at Amazon Web Services going offline for a few hours.

• ​Some info from Steve Souders showing a 31% increase in load times.
• ​Google Analytics use case
• ​Facebook JavaScript SDK use case

[niallkennedy]

check if src before outputting new script element with empty src attribute

[Tom Smith]

This is actually more important than 'trivial' for us right now. We are using the facebook plugin, and getting the src="" empty script tag, which is causing our server logs to reflect inaccurate visits and affect site performance. Please add patch to core.

[wonderboymusic]

these are all marked 3.7-early

[SergeyBiryukov]

Related: #25017

[nacin]

In 25465:

If the script_loader_src filter returns nothing, bail instead of printing <script src="">.

props niallkennedy.
fixes #22470.