Steps to reproduce the issue

• Profile a post page with Lighthouse, with Performance checking enabled
• Enable Likes or Comment Likes
• Profile the page again

What I expected

• Small performance impact, ~10%

What happened instead

• Large performance impact - 150-200kb of extra bytes downloaded, 1.5-3 seconds added to DOM interactive time, 10-15 points shaved off Performance score (on test site)

Why?

A bunch of reasons:

• we load jquery two extra times, once in master.html for posting messages to wpcom and once in another iframe
• we do some hacky resizing of the iframe which causes the page to reflow a few times

How should we fix?

I think a first pass to eliminate some of these extra requests for dependencies would help a lot. Inlining the button style, replacing jquery with a minimal set of polyfills and functions for ajax, finding elements via selectors, jQuery.inArray() would reduce the number of requests, and the bytes requested.

A second pass could eliminate the button iframe entirely, perhaps using the Shadow DOM API or similar to sandbox the button styles from the page.

https://developers.google.com/web/fundamentals/web-components/shadowdom