Riad Benguella: Debugging WordPress Scripts and Styles

With the move to more JavaScript and Styles in WordPress admin pages and editors, I spend some time debugging what styles and scripts are being loaded on a given page. (Specially important if you’re working on blocks, or JavaScript rendered admin pages)

To help with that I use a small vibe-coded tool. It helps understanding why a script or style was enqueued on a given page.

For each script (or style) it gives:

• The uncompressed size.
• If it was enqueued explicitly.
• Which ancestor script was enqueued explicitly causing the current one to be loaded in the page as well.
• What is the direct parent script.

And it presents all of that in a digestible list.

How to use it

• Just drop the file in your WordPress plugins folder (or load in another existing plugin)
• Append ?debug_script=true to the url of the admin page that you want to debug.

That’s it, for a more complete debugging solution, consider checking the excellent Query Monitor plugin.