lemmy-ui
lemmy-ui copied to clipboard
LemmyNet
Fix Memory Leaks
I came across fuite and ran it against voyager.lemmy.ml. It shows that there are a lot of memory leaks, for example:
$ npx fuite https://voyager.lemmy.ml
Test : Go to /post/33767?scrollToComments=true and back
Memory change: +1.11 MB
Leak detected: Yes
Leaking objects:
╔══════════════════════════════════════════════════════════╤═════════╤════════════════════════╗
║ Object │ # added │ Retained size increase ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <h5> │ 1 │ +200 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <link> │ 1 │ +392 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Fx │ 1 │ +109 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ HTMLAnchorElement │ 1 │ +17 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Lw │ 1 │ +6.56 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Map │ 1 │ +92 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Mw │ 1 │ +544 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Xf │ 1 │ +998 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ _C │ 1 │ +128 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ eg │ 1 │ +710 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ ev │ 1 │ +410 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ hk │ 1 │ +4 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ ng │ 1 │ +110 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ wk │ 1 │ +69 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ xC │ 1 │ +211 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <p> │ 2 │ +373 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ bw │ 2 │ +5.55 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ h_ │ 2 │ +4.07 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PerformanceResourceTiming │ 3 │ +408 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <label> │ 7 │ +1.46 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {postView} │ 9 │ +144 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <hr> │ 11 │ +1.41 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached ElementIntersectionObserverData │ 11 │ +792 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ f_ │ 11 │ +17.7 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {showEdit} │ 12 │ +219 B ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <article> │ 13 │ +1.56 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ l_ │ 13 │ +3.94 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ u_ │ 13 │ +11.8 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {name, published_at, ap_id, local, deleted, bot_account} │ 13 │ +1.77 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {begin, end, contains} │ 19 │ +6.31 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {match} │ 19 │ +4.65 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {onClick} │ 30 │ +1.65 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ (object shape) │ 55 │ +4.05 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <button> │ 56 │ +17.1 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached DOMTokenList │ 77 │ +4.32 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {ingProperties, clean, onEnd} │ 107 │ +11.6 kB ║
╟──────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedString │ 370 │ +21.2 kB ║
╚══════════════════════════════════════════════════════════╧═════════╧════════════════════════╝
Leaking event listeners (+9.428571428571429 total):
╔════════╤═══════════════════╤════════╗
║ Event │ # added │ Nodes ║
╟────────┼───────────────────┼────────╢
║ resize │ 9.714285714285714 │ Window ║
╚════════╧═══════════════════╧════════╝
Leaking collections:
╔════════╤════════╤═══════════════════════════════════╤═══════════════════════════════════════════════════════════════════════════════════════╗
║ Type │ Change │ Preview │ Size increased at ║
╟────────┼────────┼───────────────────────────────────┼───────────────────────────────────────────────────────────────────────────────────────╢
║ Object │ +2 │ {1: {click, keydown, keyup}, ...} │ c https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:775188 ║
║ │ │ │ p https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:775646 ║
║ │ │ │ Object.on https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:776505 ║
║ │ │ │ C._addEventListeners https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:542113 ║
║ │ │ │ new C https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:540457 ║
║ │ │ │ <unknown> https://voyager.lemmy.ml/static/13e8241c/js/client.js:2:1403011 ║
╚════════╧════════╧═══════════════════════════════════╧═══════════════════════════════════════════════════════════════════════════════════════╝
The author made a blog post and video to explain how to use the tool.
By running against a local test instance it also shows which specific code is leaking memory. Make sure to disable eruda to reduce noise. Using LEMMY_UI_BACKEND_REMOTE=voyager.lemmy.ml seems to leak more than with local backend, probably because there is more data.
$ npx fuite http://localhost:1234/
Test : Go to /communities and back
Memory change: +1.76 MB
Leak detected: Yes
Leaking objects:
╔═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╤═════════╤════════════════════════╗
║ Object │ # added │ Retained size increase ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ (symbol) │ 1 │ +16 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ BannerIconHeader │ 1 │ +110 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <aside> │ 1 │ +120 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <h5> │ 1 │ +200 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <header> │ 1 │ +120 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <link> │ 1 │ +392 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <section> │ 1 │ +120 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached HTMLCollection │ 1 │ +97 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ DonationDialog │ 1 │ +211 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ HelmetWrapper │ 1 │ +789 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Home │ 1 │ +130 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ HtmlTags │ 1 │ +1.84 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ ListingTypeSelect │ 1 │ +1.01 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Map │ 1 │ +92 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PaginatorCursor │ 1 │ +410 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PostListingModeSelect │ 1 │ +69 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PostListings │ 1 │ +110 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PostOrCommentTypeSelect │ 1 │ +553 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PostSortSelect │ 1 │ +110 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SideEffect │ 1 │ +197 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SiteSidebar │ 1 │ +7.55 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SortSelect │ 1 │ +716 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ TimeIntervalSelect │ 1 │ +4 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ (system) │ 2 │ +860 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ CSSStyleSheet │ 2 │ +352 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ CustomElementRegistry │ 2 │ +256 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <select> │ 2 │ +3.62 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGTitleElement │ 2 │ +544 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ DocumentTimeline │ 2 │ +368 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ FontFaceSet │ 2 │ +656 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ FragmentDirective │ 2 │ +112 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Navigation │ 2 │ +352 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ NavigationActivation │ 2 │ +80 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Performance │ 2 │ +4.24 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PerformanceNavigationTiming │ 2 │ +336 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGDefsElement │ 2 │ +512 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGPolygonElement │ 2 │ +656 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGSVGElement │ 2 │ +1.41 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ ScriptRunner │ 2 │ +208 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ ScriptedAnimationController │ 2 │ +416 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ StyleEngine │ 2 │ +2.05 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ StyleSheetCollection │ 2 │ +384 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ V │ 2 │ +741 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Viewport │ 2 │ +64 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ VisibilityStateEntry │ 2 │ +176 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ VisualViewport │ 2 │ +64 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Window │ 2 │ +4.98 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ XMLDocument │ 2 │ +10.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <ul> │ 3 │ +360 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ LayoutShift │ 3 │ +1.06 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ LayoutShiftAttribution │ 4 │ +608 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <label> │ 5 │ +1.04 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PerformanceResourceTiming │ 5 │ +680 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <input> │ 6 │ +3.8 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ DOMRectReadOnly │ 8 │ +448 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <picture> │ 9 │ +1.08 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PictrsImage │ 9 │ +7.39 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Set │ 9 │ +684 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGRectElement │ 10 │ +7.36 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ (sliced string) │ 11 │ +220 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ CommunityLink │ 11 │ +8.65 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <article> │ 11 │ +1.32 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <h1> │ 11 │ +1.32 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <hr> │ 11 │ +1.41 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ MomentTime │ 11 │ +3.29 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ PostListing │ 11 │ +105 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ UserBadges │ 11 │ +10.3 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ VoteButtons │ 11 │ +18.1 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {name, published_at, ap_id, local, deleted, bot_account} │ 11 │ +1.54 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {name, title, removed, published_at, deleted, nsfw, ap_id, local, posting_restricted_to_mods, visibility, local_removed} │ 11 │ +2.7 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {post, creator, community, creator_is_admin, tags, can_mod, creator_banned, creator_is_moderator} │ 11 │ +744 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {title, data-tippy-content, onClick, href} │ 11 │ +1.63 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached CSSStyleDeclaration │ 12 │ +784 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ EventListener │ 12 │ +768 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGCircleElement │ 12 │ +6.34 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ V8EventListener │ 12 │ +480 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {containerStyle, initLayout, originLeft, originTop, resize, resizeContainer, transitionDuration, hiddenStyle, visibleStyle} │ 12 │ +864 B ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGLineElement │ 14 │ +8.4 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <option> │ 16 │ +12.1 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <img> │ 18 │ +12.1 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {begin, end, contains} │ 19 │ +6.31 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <slot> │ 20 │ +3.84 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGGElement │ 26 │ +6.66 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <source> │ 27 │ +4.99 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {data-tippy-content} │ 27 │ +1.94 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <li> │ 30 │ +3.92 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached EventListener │ 31 │ +1.98 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached V8EventListener │ 31 │ +1.24 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {title, href, onClick} │ 34 │ +2.59 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached DOMStringMap │ 36 │ +1.75 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ (object shape) │ 46 │ +2.67 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <button> │ 46 │ +14.3 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedNumber │ 49 │ +3.14 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGPathElement │ 49 │ +16.1 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGUseElement │ 49 │ +108 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Icon │ 49 │ +20.5 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <a> │ 70 │ +19.9 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached DOMTokenList │ 73 │ +4.09 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached ShadowRoot │ 77 │ +76.5 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ system / Context │ 95 │ +31.9 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedPreserveAspectRatio │ 98 │ +6.27 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedRect │ 98 │ +6.27 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGSVGElement │ 98 │ +93.7 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <span> │ 132 │ +20.7 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Function │ 138 │ +88.2 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SubClass │ 144 │ +70.7 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {isBorderBox} │ 144 │ +19 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached <div> │ 145 │ +19.2 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGSymbolElement │ 168 │ +98.1 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedPreserveAspectRatio │ 170 │ +10.9 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedRect │ 170 │ +10.9 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedTransformList │ 196 │ +12.5 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGPathElement │ 222 │ +72.8 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedNumber │ 260 │ +16.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ {layout} │ 264 │ +23 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedTransformList │ 290 │ +18.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedString │ 296 │ +17 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached Text │ 359 │ +30.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedString │ 458 │ +25.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Array │ 570 │ +207 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Detached SVGAnimatedLength │ 588 │ +37.6 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ Text │ 638 │ +51 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ SVGAnimatedLength │ 832 │ +53.2 kB ║
╟─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼────────────────────────╢
║ V │ 1209 │ +138 kB ║
╚═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╧═════════╧════════════════════════╝
Leaking event listeners (+12 total):
╔════════╤═════════╤════════╗
║ Event │ # added │ Nodes ║
╟────────┼─────────┼────────╢
║ resize │ 12 │ Window ║
╚════════╧═════════╧════════╝
Leaking collections:
╔════════╤════════╤═══════════════════════════════════╤═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╗
║ Type │ Change │ Preview │ Size increased at ║
╟────────┼────────┼───────────────────────────────────┼─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╢
║ Object │ +6 │ {1: {click, keydown, keyup}, ...} │ getElementEvents webpack://lemmy-ui/./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/bootstrap/js/dist/dom/event-handler.js?:44:24 ║
║ │ │ │ addHandler webpack://lemmy-ui/./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/bootstrap/js/dist/dom/event-handler.js?:110:20 ║
║ │ │ │ Object.on webpack://lemmy-ui/./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/bootstrap/js/dist/dom/event-handler.js?:149:7 ║
║ │ │ │ Modal._addEventListeners webpack://lemmy-ui/./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/bootstrap/js/dist/modal.js?:171:20 ║
║ │ │ │ new Modal webpack://lemmy-ui/./node_modules/.pnpm/[email protected]_@[email protected]/node_modules/bootstrap/js/dist/modal.js?:70:12 ║
║ │ │ │ eval webpack://lemmy-ui/./src/shared/components/mixins/modal-mixin.ts?:38:22 ║
╟────────┼────────┼───────────────────────────────────┼─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╢
║ Object │ +12 │ {1: SubClass, ...} │ SubClass.Outlayer webpack://lemmy-ui/./node_modules/.pnpm/[email protected]/node_modules/outlayer/outlayer.js?:69:19 ║
║ │ │ │ new SubClass webpack://lemmy-ui/./node_modules/.pnpm/[email protected]/node_modules/outlayer/outlayer.js?:880:12 ║
║ │ │ │ eval webpack://lemmy-ui/./src/shared/utils/browser.ts?:143:7 ║
║ │ │ │ Generator.next <anonymous> ║
║ │ │ │ asyncGeneratorStep webpack://lemmy-ui/./node_modules/.pnpm/@[email protected]/node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js?:7:17 ║
║ │ │ │ _next webpack://lemmy-ui/./node_modules/.pnpm/@[email protected]/node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js?:21:9 ║
╚════════╧════════╧═══════════════════════════════════╧═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╝
I wouldn't worry too much about front end memory for progressive web apps like this, where navigating to new pages is going to increase the memory footprint. I imagine this is much more important for a static website.
I'm not even sure how a lot of these larger ones classify as "leaks". It counts navigating to the home page, or viewing postlistings as "leaks", which of course are going to increase the memory.
I'd rather just use firefox or chrome's web tools to make sure our footprint isn't too large, and I'm sure we're far below the vast majority of websites like medium.
I'm less worried about web memory leaks, and more worried about the node backend memory leaks, which is a constantly running service that I'm sure does no memory cleanups whatsoever. That could really only be fixed by something like leptos IMO.
See the introductory blog post for details how it works. The page navigation is a trick to narrow down where a leak is happening. When you go from homepage to post view and back, memory usage should be same as before, if it is significantly higher than before it means there is probably a leak.
These same memory leaks would affect the NodeJS backend as well, because it runs the same code for SSR. So fixing them should also help with memory usage on the server. If you search for "nodejs memory leaks" you can also find numerous guides on how to debug and fix these.