lag when writing comments on youtube - likely bad interaction with other extensions

[laundmo]

Bug description

I decided to investigate some slowness on youtube using the profiler and noticed that this extension listens for element changes and uses a lot of time for that.

im very sure its a interaction with some other extension, as i wasnt able to reproduce this issue in a new profile.

Steps to reproduce

None, as i wasnt able to reproduce with a blank browser profile

Actual behavior

on youtube: while typing comments, characters take seconds to show up. very slow ui.

as you can see, this addon takes 50% of youtubes entire cpu usage when this happens.

Expected behavior

I fully expected this extension to not do anything at all when it detects a page is not a mastodon instance.

System

Operating system and version: Win 10
Browser and version: Firefox
Add-on version: Latest

Possible solution

Extension should disable itself when encontering a non-masto page, as its supposed to only do any work on mastodon instances.

[rugk]

@laundmo Thanks for the detailed report.

The Stacktrace points here:

mastodon-simplified-federation/src/content_script/misskeyInject.js

Line 45 in ecd5411

const getElement = () => (

Which could likely be a problem due to the MutationObserver running here:

mastodon-simplified-federation/src/content_script/misskeyInject.js

Line 63 in ecd5411

const element = getElement();

I see you already used Firefox profiler. It would likely be helpful if you uploaded that and gave the Firefox profiler link, AFAIK this is possible there. Maybe also to see the full stacktrace there?

[rugk]

Asked ChatGPT for help and here is what it essentially suggested, which could help:

It seems like you've encountered a performance issue with your WebExtension project, specifically related to the MutationObserver in your content script. The provided information suggests that your extension is causing slowdowns on YouTube and consuming a significant amount of CPU resources. The issue might be related to the extension running on non-Mastodon instances, which is not the intended behavior.

Here are some suggestions to improve the performance impact of your extension:

1. Conditional Execution: As you've correctly identified, the main performance bottleneck seems to be the MutationObserver running even on non-Mastodon instances. To address this, you can add a check at the beginning of your init() function to only execute the rest of the code when the page is a Mastodon instance. This will prevent unnecessary execution and resource usage on non-Mastodon pages.

async function init() {
    if (!window.location.hostname.includes("mastodon")) {
        return; // Exit early on non-Mastodon instances
    }

    // Rest of your init() function code
}

2. Targeted Observations: You can further optimize the MutationObserver by narrowing down the scope of observation. For example, instead of observing the entire mainColumn, you can target specific elements that are likely to contain the interactions buttons. This will reduce the number of observed elements and improve overall performance.

3. Debouncing and Throttling: If the MutationObserver updates are causing too many frequent calls, consider using debouncing or throttling techniques to control the rate at which your code responds to mutations. This can help reduce the overall impact on performance.

4. Memory Cleanup: Ensure that you're properly cleaning up event listeners and observers when they are no longer needed. In your case, when the user navigates away from a Mastodon instance, you might want to disconnect and clean up the MutationObserver.

5. Profiling and Benchmarking: Use the browser's built-in developer tools to profile your extension's performance and identify specific areas causing slowdowns. This will help you pinpoint the exact parts of your code that need optimization.

6. Selective Injection: Consider injecting your content script only on specific Mastodon-related pages where your script is needed, rather than on all websites. This can reduce the chances of interference with other websites and extensions. [by me: stupid ChatGPT, this is not possible]

I guess 1. could solve it there. I just wonder that not even the Mastodon content script has this feature.
Note that in any case, one can navigate the SPA's like Mastodon, so the observer is needed, but maybe it can indeed be limited or throttled somehow.
In any case I saw there is already a timeout of 200.000 ms aka 2-3min:

mastodon-simplified-federation/src/content_script/misskeyInject.js

Line 43 in ecd5411

function waitForElement(selector, multiple = false, timeoutDuration = 200000) {

…so after this time, the issues should go away as that timeout is as far as I see, used everywhere? Can you confirm that?
And yeah, I know that:

• this timeout contradicts of what I said about SPAs before, because well you can navigate it well after 5min…
• it is on the other side very high, so on non-Fediverse sites this is indeed still a bad performance impact that needs to be considered…

[rugk]

/cc @austinhuang0131 @hueyy as you may be interested in that (i.e. previously contributed to these files…)

Also BTW, aside from that we could generalize the waitForElement function, so we do not need to have it in each content script, but inject a common.js content script, everywhere, where needed (before the other scripts).

[laundmo]

solution 1. won't help as it depends on the hostname including mastodon. as always, gpt is clueless. you'd have to come up with a way to reliably detect mastodon - a way with no false negatives.

even after further testing i can't find the combination of extensions and settings causing this to happen, even though i consistently happens on my main install.

I'm not sure what potentially private information is contained in a firefox profiler run, so I'm unwilling to share that. as i didn't really use the extension this much, i consider the issue unreproducible.

probably shouldn't event have made one without a reproduction ready.

[rugk]

up with a way to reliably detect mastodon - a way with no false negatives

Yeah of course I assumed that, did not even bother to mention that obvious mistake 😆 But there are ways like detecting some CSS class or whatever, which may not change, so certainly possible in theory.

And no the issue is fine for me personally, because even when having no 100% reliable reproducer it gives an indicator there is something to improve. BTW, what made you open the issue actually – you likely did not randomly jump into the profiler just for fun? Was there a visible performance impact?

Also, did you maybe use some other extensions, which modify YouTube (like adding buttons) or so (SponsorBlock e.g.)?

[austinhuang0131]

if we want to just not inject on non-mastodon instances then we could set the default isLoggedIn() to true for a quick fix

ofc something similar needs to be done for misskey

[laundmo]

BTW, what made you open the issue actually – you likely did not randomly jump into the profiler just for fun? Was there a visible performance impact?

I'll quote the original issue text:

while typing comments, characters take seconds to show up.

as in: i hit a key and seconds later the character shows up in the text

Also, did you maybe use some other extensions, which modify YouTube (like adding buttons) or so (SponsorBlock e.g.)?

yes, that's what i was trying to figure out with getting a reproduction - and why i don't think it matters much in the end. i have a lot of YouTube extensions: from the top of my head: enhancer, unhook, channel blocker, sponsorblock, return dislikes. of course when i add them to a fresh browser profile it all works fine.

[rugk]

Okay, so could also be a combination of those and this extension here as it just modifies way too much stuff (maybe triggered by keypress) and then react… causing performance issues.

I guess as an edge case I agree it is quite low-priority, anyway I would like to reopen this as the proposed enhancements to the content scripts to have less impact while browsing on non-Mastodon sites are valid, of course in any case and may actually help in more cases etc. (and many users will not debug/find out the issue is related to this extension or even report it in such a well-researched way).