Enqueueing Scripts/Styles mid-page

Question

Since WP 3.3, the codex has been updated for both wp_enqueue_script and wp_enqueue_style that you can now enqueue both mid-page (within the HTML body).

I see this as an advantage because:

• It's simpler to do that instead of having to do your logic (whether a widget is active, or a function is run) on an external function.
• Performance benefits? (see below)

I see it as a disadvantage because:

• The scripts/styles themselves are in-line, which makes it a bit harder to decipher what scripts are loaded on a page (I know - a bit lazy, but my first go is to look in the header or right before /body for scripts) before using the Network tab in Chrome.
• Not sure how this effects dependencies (if you're loading something inline, yet you have some other script loaded in the footer -- technically your in-line enqueued function is being referenced before the dependency).
• Your script/style loading is done throughout your plugin, instead of one centralized location, which - in the event you have many different scripts/styles, can make it a bit difficult to keep track of everything.

From what I've read on both accounts, it says that scripts/styles (if printed mid-body), are loaded in the footer of the site - which honestly sounds like a performance benefit - but my points above are making this a little hard to decipher if this is just preference, needs to be researched depending on the use-case, or just a lazy/easier way of enqueueing items which while possible - really isn't "the best way to go about this"

I'd appreciate anyone's input so I can hopefully untangle this. Thanks!

Answer 1

Using wp_enqueue_* 'in the body of the page' (by which I really mean inside widget or shortocde callbacks) is an excellent way to ensure that scripts/styles are only loaded when they are needed (i.e. when the shortcode/widget is actually present on the page).

Script/Styles Location

Scripts and styles are then loaded either in the header (if enqueued before the page starts being generated), or else in the footer. So you only need to check two places to see if a script has loaded.

Dependencies

WordPress handles these. As mentioned, scripts and styles are printed in one of two places. If you enqueue a script 'in-line', it won't be printed inline, but in the footer. Before doing so WordPress loads any dependencies that haven't already been loaded in the header.

Decentralised script handling

You should register your all scripts on the wp_enqueue_scripts hook. Then all handling of all your scripts lie in one place (script location, version, dependecies etc). The only thing you should do elsewhere is enqueue them, and it's much easier to do this by enqueuing them in-line than performing convoluted, and maybe expensive, checks in one place.