Skip to content

fix(perfmatters): match Jetpack social logos by identifier (NPPM-3167) - #995

Draft
wil-gerken wants to merge 2 commits into
releasefrom
hotfix/nppm-3167-social-logos-rucss-exclusion
Draft

fix(perfmatters): match Jetpack social logos by identifier (NPPM-3167)#995
wil-gerken wants to merge 2 commits into
releasefrom
hotfix/nppm-3167-social-logos-rucss-exclusion

Conversation

@wil-gerken

@wil-gerken wil-gerken commented Aug 27, 2026

Copy link
Copy Markdown
Contributor

All Submissions:

Changes proposed in this Pull Request:

Jetpack's social share icons can render as unstyled text until the reader interacts with the page. On mobile, they may not appear correctly until someone starts scrolling.

Newspack excludes Jetpack's social-icons stylesheet from Perfmatters' Remove Unused CSS using _inc/social-logos. Jetpack 15.7 moved the file to _inc/build/social-logos/, so that exclusion no longer matches and Perfmatters delays the stylesheet.

This changes the exclusion to social-logos, which matches both the stylesheet URL and its social-logos-css handle. It also continues to work when Jetpack's Asset CDN serves the file from a different path. Perfmatters matches against the <link> tag as first captured, before its own minifier can rewrite the href, so the handle keeps matching even when the URL changes entirely.

The change is a strict widening of the old exclusion, so the only new failure mode is a stylesheet being left unoptimised — never one being withheld.

Reference: NPPM-3167

How to test the changes in this Pull Request:

Perfmatters skips logged-in users, so test while logged out. Throughout, the sharedaddy stylesheet acts as a control: it matches a different exclusion entry that this PR does not touch, so it keeps its href in every state below. If a command returns nothing at all, the setup is wrong rather than the bug being absent.

Reproduce on release:

  1. On a site with Perfmatters active and Jetpack Sharing enabled, publish a post with share buttons.

  2. Turn off Jetpack's Asset CDN with wp jetpack module deactivate photon-cdn. It is on by default, and leaving it on can stop Perfmatters building the used-CSS bundle this half depends on.

  3. Run wp perfmatters clear-used-css and wp cache flush.

  4. Load the post two or three times while logged out, with a different query string each time (?1, ?2, ?3), so page caching does not replay an earlier response.

  5. Run:
    curl -s '<post-url>' | grep -oE "<link[^>]*(social-logos|sharedaddy)[^>]*>"

  6. Confirm the social-logos tag has data-pmdelayedstyle and no href, and that sharedaddy has a real href.

    The tag is the check, not the page. On a stock install Perfmatters builds its used-CSS bundle from this stylesheet and inlines it, so the icons can still paint while the link is withheld. Sites carrying other stylesheets usually get a bundle without the social-logos @font-face, and there the icons stay unstyled until interaction.

Verify this PR:

  1. Check out this PR's branch, then repeat steps 3–5.
  2. Confirm the social-logos tag now has a real href, and that sharedaddy still does.
  3. Confirm the icons render correctly on first paint without interaction. With the fix the stylesheet is excluded from RUCSS and loads normally, so this holds in every environment.

Also check the Asset CDN path:

This is the configuration the issue was reported under. It needs the page to load at least one stylesheet that Newspack's defaults do not already exclude — any third-party plugin with front-end CSS will do. A stock Newspack install has none, which is why the bundle never gets built there and this half silently passes without one.

  1. Re-enable the CDN with wp jetpack module activate photon-cdn, and confirm the stylesheet is now served from c0.wp.com (this requires a release-numbered Jetpack; alpha builds are not served from the CDN).
  2. On release: run step 3, load the post logged out with ?1 and then ?2, and run step 5's command. The first load builds the bundle; the second delays the stylesheet. Confirm the social-logos tag has data-pmdelayedstyle pointing at the c0.wp.com URL.
  3. On this PR's branch: repeat, and confirm the c0.wp.com URL now has a real href.

If Perfmatters was activated, upgraded, or had its settings saved while this branch was checked out, the corrected entry is already in the database. Those paths read the options through Newspack's option_perfmatters_options filter and save the result back. Editing the PHP to _inc/social-logos then does not restore the old behaviour, because set_defaults() re-merges the stored list. Rewrite rucss_excluded_stylesheets in the perfmatters_options option as well. Front-end loads on their own never re-save it.

Tests:

  1. Change the exclusion back to _inc/social-logos and run n test-php --group perfmatters. Two of the 15 tests fail, both social-logos cases. The unit tests build the list from an empty array, so the stored option does not affect them.

Other information:

  • Have you added an explanation of what your changes do and why you'd like us to include them?
  • Have you written new tests for your changes, as applicable?
  • Have you successfully run tests with your changes locally?

Notes for reviewers

Test coverage: The new test uses Perfmatters' actual matching behavior — a case-insensitive substring match against the full <link> tag — rather than just checking that the exclusion exists in the array. That matters here because _inc/social-logos was still present even after it stopped matching Jetpack's stylesheet. Both the plugin-directory and Asset CDN forms are covered.

Related exclusions: The two Jetpack entries below this one still use plugins/jetpack/ paths that do not match under the Asset CDN. That is a separate issue and will be handled in a follow-up.

Existing Perfmatters settings: Sites that no longer receive our current Perfmatters defaults will not automatically get this corrected exclusion. That delivery problem is also being tracked separately.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates Perfmatters exclusions so Jetpack social icons render correctly across plugin and CDN asset paths.

Changes:

  • Matches Jetpack social-logo styles by stable identifier.
  • Adds coverage for plugin-hosted and CDN-hosted sharing styles.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File Description
includes/plugins/class-perfmatters.php Broadens the social-logo exclusion.
tests/unit-tests/perfmatters.php Tests actual substring-matching scenarios.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants