Octotree is suddenly *VERY* lag (excessive recalculate style)

GalvinGao commented 2 years ago

Description

If this is a bug, provide as much information as you can to help reproduce the issue.

This is quite reproducible on my side across all repositories that I've visited, no matter how big they are.
Some of the example ones: https://github.com/MaaAssistantArknights/maa-website, https://github.com/penguin-statistics/backend-next

Open a new tab
Enter a repository. Here I choose https://github.com/penguin-statistics/backend-next.
Expand some folders, and then navigate to some random files. Here I have just chose to click all files under https://github.com/penguin-statistics/backend-next/tree/main/internal/model. Notice that you have to navigate the files via Octotree, not going backward/forward and navigate using the vanilla GitHub way.
After navigating 10 files, it is now very obviously, increasingly laggy: After you click a file, the content and the header of the file details page do change pretty instantly. However, the last commit oftenly can't load within about a second or so, and the main thread is completely busy (I can't click on dropdowns and moving my cursor around the page doesn't change the cursor style at all - until the main thread is finished with calculating stuff).
After navigating 15 files, it is now about ~10-15 seconds for a single page to load (or should i say, for the main thread to become idle again).

I've attached a profile for reference. Here's the performance tab screenshot for overview purposes.

You can clearly see that it is becoming increasingly laggy.

Environment (if bug)

Octotree version: v7.6.0
Browser & version: 104.0.5112.79 (Official Build) (arm64)
OS & version: macOS Monterey 12.4 (21F79)
Screenshot, if any (drag an image here)
Console error log below this line There's not really some relevant console log here, but I'll attach it anyway just for your reference.

Details

``` Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT /penguin-statistics/backend-next/blob/main/internal/infra/redsync.go:1 Autofocus processing was blocked because a document already has a focused element. collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT refined-github.js:3912 ❌ toggle-files-button refined-github.js:3912 📕 22.8.8 → TypeError: Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'. at observeElement (refined-github.js:6855:23) at init (refined-github.js:6958:28) at async runFeature (refined-github.js:3954:20) at async setupPageLoad (refined-github.js:3960:34) refined-github.js:3913 🔍 Search issue https://github.com/refined-github/refined-github/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+Failed+to+execute+%27observe%27+on+%27MutationObserver%27%3A+parameter+1+is+not+of+type+%27Node%27. refined-github.js:3913 🚨 Report issue https://github.com/refined-github/refined-github/issues/new?labels=bug&template=1_bug_report.yml&title=%60toggle-files-button%60%3A+Failed+to+execute+%27observe%27+on+%27MutationObserver%27%3A+parameter+1+is+not+of+type+%27Node%27.&example_urls=https%3A%2F%2Fgithub.com%2Fpenguin-statistics%2Fbackend-next%2Ftree%2Fmain%2Finternal%2Fmodel&description=%60%60%60%0ATypeError%3A+Failed+to+execute+%27observe%27+on+%27MutationObserver%27%3A+parameter+1+is+not+of+type+%27Node%27.%0A++++at+observeElement+%28chrome-extension%3A%2F%2Fhlepfoohegkhhmjieoechaddaejaokhf%2Frefined-github.js%3A6855%3A23%29%0A++++at+init+%28chrome-extension%3A%2F%2Fhlepfoohegkhhmjieoechaddaejaokhf%2Frefined-github.js%3A6958%3A28%29%0A++++at+async+runFeature+%28chrome-extension%3A%2F%2Fhlepfoohegkhhmjieoechaddaejaokhf%2Frefined-github.js%3A3954%3A20%29%0A++++at+async+setupPageLoad+%28chrome-extension%3A%2F%2Fhlepfoohegkhhmjieoechaddaejaokhf%2Frefined-github.js%3A3960%3A34%29%0A%60%60%60 collector.github.com/github/collect:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT api.github.com/_private/browser/stats:1 Failed to load resource: net::ERR_BLOCKED_BY_CLIENT DevTools failed to load source map: Could not load content for chrome-extension://hlepfoohegkhhmjieoechaddaejaokhf/refined-github.js.map: System error: net::ERR_BLOCKED_BY_CLIENT ```

danhgit commented 2 years ago

Hi, I can't reproduce the issue. Can you test in different browser profile without any other extension, to ensure that it's really Octotree that causes this?

GalvinGao commented 2 years ago

Hi, I can't reproduce the issue. Can you test in different browser profile without any other extension, to ensure that it's really Octotree that causes this?

I just tried reproducing this on a profile with only Octotree present and it is not reproducible anymore. I then tried to disable an extension "Refined GitHub" on my primary profile and now the issue has gone. I'll file an issue on their side.

Thanks for the help!

jdreesen commented 2 years ago

I also suffer from this problem. Could you please reopen and investigate this? According to @refined-github's investigation, the problem is caused by octotree.

GalvinGao commented 2 years ago

Indeed. I'll reopen this

danhgit commented 2 years ago

Thanks for the detailed information, we're looking into this.

danhgit commented 2 years ago

We just released a fix. Please look out for version 7.6.1. Thanks again for reporting the issue and providing useful details.

jdreesen commented 2 years ago

The issue seems to be fixed, it didn't happen for me in the last days. Thx! :)

danhgit commented 2 years ago

Thanks for confirming @jdreesen! I'm closing the issue now.

ovity / octotree