Enhance detection of enqueued frontend assets #136

manuelRod · 2022-01-28T11:59:05Z

Summary

Enhances for Site Health Enqueued assets module.
Fixes #135

Relevant technical choices

Follow up of the previous closed PR #54

Checklist

PR has either [Focus] or Infrastructure label.
PR has a [Type] label.
PR has a milestone or the no milestone label.

…_url. Changing hooks to capture enqueued scripts/styles and inlines.

…ueued-assets-enhance

felixarntz

@manuelRod This looks solid to me!

Would love to get someone else to review as well, can you maybe give this a pass @aristath?

modules/site-health/audit-enqueued-assets/load.php

mitogh · 2022-02-28T23:41:20Z

modules/site-health/audit-enqueued-assets/load.php

+				$inline_size = 0;
+				if ( ! empty( $script->extra ) && ! empty( $script->extra['after'] ) ) {


Similar to the above.

Suggested change

$inline_size = 0;

if ( ! empty( $script->extra ) && ! empty( $script->extra['after'] ) ) {

if ( empty( $script->extra['after'] ) || ! is_array( $script->extra['after'] ) ) {

continue;

}

$inline_size = 0;

this would break functionality. If empty extra['after'] $inline_size will be 0 and that's it, we don't need to skip the iteration with continue, since the loop is not finished.

modules/site-health/audit-enqueued-assets/load.php

mitogh · 2022-02-28T23:43:19Z

modules/site-health/audit-enqueued-assets/load.php

+				if ( ! empty( $style->extra ) && ! empty( $style->extra['path'] ) ) {
+					$path = $style->extra['path'];
+				} else { // Fallback to getting the path from the style's src.
+					$path = perflab_aea_get_path_from_resource_url( $style->src );
+				}


By inverting the conditional here allows the removal of the ! operator, allowing for a more natural flow.

Suggested change

if ( ! empty( $style->extra ) && ! empty( $style->extra['path'] ) ) {

$path = $style->extra['path'];

} else { // Fallback to getting the path from the style's src.

$path = perflab_aea_get_path_from_resource_url( $style->src );

}

// default to getting the path from the style's src.

if ( empty( $style->extra ) || empty( $style->extra['path'] ) ) {

$path = perflab_aea_get_path_from_resource_url( $style->src );

} else {

$path = $style->extra['path'];

}

@mitogh Not sure I agree in this case, the original code here explicitly looks at whether the $style->extra value is not empty, and the other function use would be the fallback. I don't have a strong preference on the order, but with your suggestion here the comment in line 71 is no longer accurate.

Oh, right let me update line 71.

Mostly this pattern avoids the usage of ! which translates 1 operation into 2.

I'd argue that's a bit of a micro optimization. IMO the code path checking ! empty( $var ) and then using $var is more straightforward to read.

The suggestion goes more towards optimization for reading rather than performance so it becomes a personal preference I would say either way is fine, but IMO this seems easier to read:

If empty then

Else

Rather than

If not empty then

else

I also don't agree with this (since is a personal preference), to me, seems more natural and easier to read the way it is right now.

mitogh · 2022-02-28T23:43:24Z

modules/site-health/audit-enqueued-assets/load.php

+
+				// Add any extra data (inlined) that was passed with the style.
+				$inline_size = 0;
+				if ( ! empty( $style->extra ) && ! empty( $style->extra['after'] ) ) {


Similar comment to the above.

same as above, it would break functionality.

dainemawer

Nice work overall, left a few questions!

dainemawer · 2022-03-01T04:37:26Z

modules/site-health/audit-enqueued-assets/helper.php

@@ -78,14 +78,29 @@ function perflab_aea_get_total_size_bytes_enqueued_styles() {

 /**
 * Convert full URL paths to absolute paths.
+ * Covers Standard WP configuration, wp-content outside WP directories and subdirectories.
+ * Ex: https://example.com/content/themes/, https://example.com/wp/wp-includes/
 *
 * @since 1.0.0
 *
 * @param string $resource_url URl resource link.
 * @return string Returns absolute path to the resource.
 */
 function perflab_aea_get_path_from_resource_url( $resource_url ) {


Im noticing quite a few varying function namespaces - maybe this function should be called perflab_get_path_from_resource_url?

hello, @dainemawer all functions are prepending "perflab_aea", what are the function namespaces varying? maybe I'm missing some

I think the approach of having module specific namespaces (all of them starting with perflab_ though due to the overall plugin) is a solid approach, which avoids us running into accidental conflicts between individual modules.

@manuelRod I was thinking more globally across the plugin - I've noticed other functions are all prefixed with perflab_ but not necessarily perflab_aea - that being said it sounds like @felixarntz is good with this approach - Im not swayed either way - just wanted to call it out for consistency reasons :)

modules/site-health/audit-enqueued-assets/helper.php

dainemawer · 2022-03-01T04:40:34Z

modules/site-health/audit-enqueued-assets/load.php

-					'src'  => $src,
-					'size' => perflab_aea_get_resource_file_size( perflab_aea_get_path_from_resource_url( $src ) ),
+					'src'  => $script->src,
+					'size' => perflab_aea_get_resource_file_size( $path ) + $inline_size,


Does this size take into account the size on the server / disk - or the transferred / gzipped size? Probably worth noting as the 2 can be different and could skew results.

it's the disk/server size. It uses filesize() to get the file size.

@manuelRod - that makes sense - just so Im understanding correctly, would that size be more or less the same than transferred / gzipped size?

dainemawer · 2022-03-01T04:41:55Z

modules/site-health/audit-enqueued-assets/load.php


 /**
- * Audit enqueued styles in the frontend. Ignore /wp-includes styles.
+ * Audit enqueued and printed styles in the frontend. Ignore /wp-includes styles.


Why would we ignore wp-includes? Gutenberg for instance adds a couple of stylesheets that arent exactly optimized. My opinion is that we should give the user the full picture, even if it means flagging WP for enqueuing unnecessary stylesheets.

@dainemawer those assets are included by default by wp, and this module focus on an overall overview of external assets being enqueued (plugins, theme), I think it would make more noise to include wp-includes, since most of the consumers won't be techies and won't know how to react on it.
I agree that going forward and as we iterate over this module, we can show more useful information, at that point, we can add more info (like wp-includes) and tips on how to improve it, but for now, I would just ignore them.

Thats a fair statement, thanks @manuelRod !

aristath

Apologies it took me so long to get to this PR.
The code looks good to me and makes sense 👍

felixarntz · 2022-03-03T00:47:10Z

@manuelRod FYI Since we've branched off from trunk into a release/1.0.0-beta.1 branch, I've updated the base branch of this PR to that new branch. So going forward, please make sure to work off release/1.0.0-beta.1, and specifically not merge trunk into this again.

manuelRod · 2022-03-04T11:46:42Z

applied some of the comments! not sure if anyone wants to review them again to be ready for the release @felixarntz @aristath

felixarntz

@manuelRod Two more tiny changes needed here based on the change from https://github.com/WordPress/performance/pull/136/files#r819490106, I can quickly add them.

modules/site-health/audit-enqueued-assets/load.php

…rl()` are properly handled.

felixarntz

Added the two tiny changes, all the rest already lgtm before. Thank you, great work @manuelRod!

manuelRod added 2 commits January 28, 2022 12:50

Adding new supported wp setups for perflab_aea_get_path_from_resource…

780b098

…_url. Changing hooks to capture enqueued scripts/styles and inlines.

Merge branch 'add/sitehealth-enqueued-assets' into add/sitehealth-enq…

306bbec

…ueued-assets-enhance

manuelRod requested a review from audrasjb as a code owner January 28, 2022 11:59

manuelRod marked this pull request as draft January 28, 2022 11:59

manuelRod mentioned this pull request Jan 28, 2022

Enhance reliability of how Site Health enqueued assets module detects assets #135

Closed

eclarke1 added [Focus] Site Health [Type] Feature labels Jan 28, 2022

felixarntz added this to the 1.0.0-beta.1 milestone Jan 28, 2022

felixarntz changed the title ~~Add/sitehealth enqueued assets enhance~~ Enhance detection of enqueued frontend assets Jan 28, 2022

felixarntz added [Type] Enhancement and removed [Type] Feature labels Jan 28, 2022

felixarntz marked this pull request as ready for review February 18, 2022 16:09

felixarntz added the [Module] Audit Enqueued Assets label Feb 18, 2022

felixarntz approved these changes Feb 18, 2022

View reviewed changes

felixarntz requested review from aristath and SergeyBiryukov February 18, 2022 16:10

felixarntz requested review from adamsilverstein and dainemawer February 28, 2022 16:24

felixarntz added the Needs Review label Feb 28, 2022

mitogh reviewed Feb 28, 2022

View reviewed changes

dainemawer reviewed Mar 1, 2022

View reviewed changes

aristath approved these changes Mar 1, 2022

View reviewed changes

felixarntz changed the base branch from trunk to release/1.0.0-beta.1 March 3, 2022 00:45

nitpicks from PR review.

fb3418e

felixarntz reviewed Mar 4, 2022

View reviewed changes

modules/site-health/audit-enqueued-assets/load.php Outdated Show resolved Hide resolved

modules/site-health/audit-enqueued-assets/load.php Show resolved Hide resolved

Ensure empty return values from `perflab_aea_get_path_from_resource_u…

493a5c5

…rl()` are properly handled.

felixarntz approved these changes Mar 4, 2022

View reviewed changes

felixarntz merged commit 675bca2 into WordPress:release/1.0.0-beta.1 Mar 4, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Enhance detection of enqueued frontend assets #136

Enhance detection of enqueued frontend assets #136

manuelRod commented Jan 28, 2022 •

edited by felixarntz

Loading

felixarntz left a comment

mitogh Feb 28, 2022

manuelRod Mar 4, 2022 •

edited

Loading

mitogh Feb 28, 2022 •

edited

Loading

felixarntz Feb 28, 2022

mitogh Feb 28, 2022

felixarntz Mar 1, 2022

mitogh Mar 1, 2022

manuelRod Mar 4, 2022

mitogh Feb 28, 2022

manuelRod Mar 4, 2022 •

edited

Loading

dainemawer left a comment

dainemawer Mar 1, 2022

manuelRod Mar 4, 2022

felixarntz Mar 4, 2022

dainemawer Mar 7, 2022

dainemawer Mar 1, 2022

manuelRod Mar 4, 2022

dainemawer Mar 7, 2022

dainemawer Mar 1, 2022

manuelRod Mar 4, 2022

dainemawer Mar 7, 2022

aristath left a comment

felixarntz commented Mar 3, 2022

manuelRod commented Mar 4, 2022

felixarntz left a comment

felixarntz left a comment

		$inline_size = 0;
		if ( ! empty( $script->extra ) && ! empty( $script->extra['after'] ) ) {

Enhance detection of enqueued frontend assets #136

Enhance detection of enqueued frontend assets #136

Conversation

manuelRod commented Jan 28, 2022 • edited by felixarntz Loading

Summary

Relevant technical choices

Checklist

felixarntz left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

manuelRod Mar 4, 2022 • edited Loading

Choose a reason for hiding this comment

mitogh Feb 28, 2022 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

manuelRod Mar 4, 2022 • edited Loading

Choose a reason for hiding this comment

dainemawer left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

aristath left a comment

Choose a reason for hiding this comment

felixarntz commented Mar 3, 2022

manuelRod commented Mar 4, 2022

felixarntz left a comment

Choose a reason for hiding this comment

felixarntz left a comment

Choose a reason for hiding this comment

manuelRod commented Jan 28, 2022 •

edited by felixarntz

Loading

manuelRod Mar 4, 2022 •

edited

Loading

mitogh Feb 28, 2022 •

edited

Loading

manuelRod Mar 4, 2022 •

edited

Loading