Refactor `useCommentCount` to rely on hook for window access by mxdvl · Pull Request #9949 · guardian/dotcom-rendering

mxdvl · 2023-12-19T11:31:26Z

What does this change?

Rely on hooks to ensure that the browser globals are accessed safely

Why?

Follow-up on:

Warn on non-SSR friendly code #9938

github-actions · 2023-12-19T11:37:11Z

Size Change: +61 B (0%)

Total Size: 730 kB

ℹ️ View Unchanged

Filename	Size	Change
`dotcom-rendering/dist/100.web.********************.js`	990 B	0 B
`dotcom-rendering/dist/1024.web.********************.js`	2.75 kB	0 B
`dotcom-rendering/dist/1076.web.********************.js`	3.08 kB	0 B
`dotcom-rendering/dist/1136.web.********************.js`	884 B	0 B
`dotcom-rendering/dist/1178.web.********************.js`	504 B	0 B
`dotcom-rendering/dist/1226.web.********************.js`	3.69 kB	0 B
`dotcom-rendering/dist/1406.web.********************.js`	5.09 kB	0 B
`dotcom-rendering/dist/1418.web.********************.js`	9.99 kB	0 B
`dotcom-rendering/dist/1465.web.********************.js`	3.32 kB	0 B
`dotcom-rendering/dist/1520.web.********************.js`	492 B	0 B
`dotcom-rendering/dist/1659.web.********************.js`	518 B	0 B
`dotcom-rendering/dist/1714.web.********************.js`	3.5 kB	0 B
`dotcom-rendering/dist/1939.web.********************.js`	3.6 kB	0 B
`dotcom-rendering/dist/1987.web.********************.js`	3.16 kB	0 B
`dotcom-rendering/dist/2092.web.********************.js`	849 B	0 B
`dotcom-rendering/dist/2186.web.********************.js`	916 B	0 B
`dotcom-rendering/dist/2394.web.********************.js`	7.9 kB	0 B
`dotcom-rendering/dist/2510.web.********************.js`	663 B	0 B
`dotcom-rendering/dist/2511.web.********************.js`	819 B	0 B
`dotcom-rendering/dist/254.web.********************.js`	638 B	0 B
`dotcom-rendering/dist/279.web.********************.js`	2.49 kB	0 B
`dotcom-rendering/dist/2848.web.********************.js`	16.2 kB	0 B
`dotcom-rendering/dist/2879.web.********************.js`	910 B	0 B
`dotcom-rendering/dist/2919.web.********************.js`	900 B	0 B
`dotcom-rendering/dist/2923.web.********************.js`	720 B	0 B
`dotcom-rendering/dist/3030.web.********************.js`	957 B	0 B
`dotcom-rendering/dist/3111.web.********************.js`	590 B	0 B
`dotcom-rendering/dist/3149.web.********************.js`	636 B	0 B
`dotcom-rendering/dist/3265.web.********************.js`	916 B	0 B
`dotcom-rendering/dist/3302.web.********************.js`	820 B	0 B
`dotcom-rendering/dist/3389.web.********************.js`	884 B	0 B
`dotcom-rendering/dist/3653.web.********************.js`	13.1 kB	0 B
`dotcom-rendering/dist/3662.web.********************.js`	3.13 kB	0 B
`dotcom-rendering/dist/3767.web.********************.js`	2.84 kB	0 B
`dotcom-rendering/dist/3795.web.********************.js`	797 B	0 B
`dotcom-rendering/dist/3968.web.********************.js`	3.79 kB	0 B
`dotcom-rendering/dist/4012.web.********************.js`	783 B	0 B
`dotcom-rendering/dist/4239.web.********************.js`	5.74 kB	0 B
`dotcom-rendering/dist/4251.web.********************.js`	8.9 kB	0 B
`dotcom-rendering/dist/4349.web.********************.js`	775 B	0 B
`dotcom-rendering/dist/4591.web.********************.js`	404 B	0 B
`dotcom-rendering/dist/4593.web.********************.js`	1.74 kB	0 B
`dotcom-rendering/dist/4610.web.********************.js`	3.49 kB	0 B
`dotcom-rendering/dist/4627.web.********************.js`	783 B	0 B
`dotcom-rendering/dist/4797.web.********************.js`	744 B	0 B
`dotcom-rendering/dist/480.web.********************.js`	524 B	0 B
`dotcom-rendering/dist/489.web.********************.js`	5.22 kB	0 B
`dotcom-rendering/dist/5332.web.********************.js`	820 B	0 B
`dotcom-rendering/dist/536.web.********************.js`	2.91 kB	0 B
`dotcom-rendering/dist/5495.web.********************.js`	676 B	0 B
`dotcom-rendering/dist/5515.web.********************.js`	30 kB	0 B
`dotcom-rendering/dist/5688.web.********************.js`	3.79 kB	0 B
`dotcom-rendering/dist/5744.web.********************.js`	720 B	0 B
`dotcom-rendering/dist/6068.web.********************.js`	775 B	0 B
`dotcom-rendering/dist/6295.web.********************.js`	999 B	0 B
`dotcom-rendering/dist/639.web.********************.js`	951 B	0 B
`dotcom-rendering/dist/6428.web.********************.js`	741 B	0 B
`dotcom-rendering/dist/657.web.********************.js`	2.46 kB	0 B
`dotcom-rendering/dist/6609.web.********************.js`	872 B	0 B
`dotcom-rendering/dist/6659.web.********************.js`	4.9 kB	0 B
`dotcom-rendering/dist/6836.web.********************.js`	5.19 kB	0 B
`dotcom-rendering/dist/6967.web.********************.js`	850 B	0 B
`dotcom-rendering/dist/721.web.********************.js`	4.23 kB	0 B
`dotcom-rendering/dist/7569.web.********************.js`	5.19 kB	0 B
`dotcom-rendering/dist/7650.web.********************.js`	23 kB	0 B
`dotcom-rendering/dist/7701.web.********************.js`	647 B	0 B
`dotcom-rendering/dist/8085.web.********************.js`	2.59 kB	0 B
`dotcom-rendering/dist/8112.web.********************.js`	3.38 kB	0 B
`dotcom-rendering/dist/8268.web.********************.js`	2.98 kB	0 B
`dotcom-rendering/dist/8395.web.********************.js`	580 B	0 B
`dotcom-rendering/dist/8401.web.********************.js`	922 B	0 B
`dotcom-rendering/dist/8414.web.********************.js`	4.96 kB	0 B
`dotcom-rendering/dist/8620.web.********************.js`	5.75 kB	0 B
`dotcom-rendering/dist/9196.web.********************.js`	784 B	0 B
`dotcom-rendering/dist/9390.web.********************.js`	743 B	0 B
`dotcom-rendering/dist/9422.web.********************.js`	614 B	0 B
`dotcom-rendering/dist/9457.web.********************.js`	6.39 kB	0 B
`dotcom-rendering/dist/9581.web.********************.js`	797 B	0 B
`dotcom-rendering/dist/9582.web.********************.js`	710 B	0 B
`dotcom-rendering/dist/9585.web.********************.js`	2.51 kB	0 B
`dotcom-rendering/dist/9597.web.********************.js`	3.26 kB	0 B
`dotcom-rendering/dist/9617.web.********************.js`	1 kB	0 B
`dotcom-rendering/dist/9920.web.********************.js`	5.5 kB	0 B
`dotcom-rendering/dist/AdPortals-importable.web.********************.js`	3.62 kB	0 B
`dotcom-rendering/dist/AlreadyVisited-importable.web.********************.js`	415 B	0 B
`dotcom-rendering/dist/AppEmailSignUp-importable.web.********************.js`	8.17 kB	0 B
`dotcom-rendering/dist/AppsEpic-importable.web.********************.js`	4 kB	0 B
`dotcom-rendering/dist/AppsFooter-importable.web.********************.js`	3.53 kB	0 B
`dotcom-rendering/dist/AppsLightboxImage-importable.web.********************.js`	2.92 kB	0 B
`dotcom-rendering/dist/AppsLightboxImageStore-importable.web.********************.js`	2.4 kB	0 B
`dotcom-rendering/dist/AudioAtomWrapper-importable.web.********************.js`	3.56 kB	0 B
`dotcom-rendering/dist/AustralianTerritorySwitcher-importable.web.********************.js`	4.6 kB	0 B
`dotcom-rendering/dist/Branding-importable.web.********************.js`	2.49 kB	0 B
`dotcom-rendering/dist/braze-web-sdk-core.web.********************.js`	36.9 kB	0 B
`dotcom-rendering/dist/BrazeMessaging-importable.web.********************.js`	5.27 kB	0 B
`dotcom-rendering/dist/CalloutBlockComponent-importable.web.********************.js`	6.79 kB	0 B
`dotcom-rendering/dist/CalloutEmbedBlockComponent-importable.web.********************.js`	5.77 kB	0 B
`dotcom-rendering/dist/CardCommentCount-importable.web.********************.js`	4.39 kB	+64 B (+1%)
`dotcom-rendering/dist/Carousel-importable.web.********************.js`	7.81 kB	0 B
`dotcom-rendering/dist/CarouselForNewsletters-importable.web.********************.js`	5.66 kB	0 B
`dotcom-rendering/dist/ChartAtom-importable.web.********************.js`	500 B	0 B
`dotcom-rendering/dist/CommentCount-importable.web.********************.js`	3.2 kB	0 B
`dotcom-rendering/dist/DiscussionContainer-importable.web.********************.js`	24.1 kB	0 B
`dotcom-rendering/dist/DiscussionMeta-importable.web.********************.js`	3.73 kB	0 B
`dotcom-rendering/dist/DocumentBlockComponent-importable.web.********************.js`	3.57 kB	0 B
`dotcom-rendering/dist/EmbedBlockComponent-importable.web.********************.js`	4.09 kB	0 B
`dotcom-rendering/dist/EnhancePinnedPost-importable.web.********************.js`	1.97 kB	0 B
`dotcom-rendering/dist/FetchOnwardsData-importable.web.********************.js`	2.5 kB	0 B
`dotcom-rendering/dist/FilterKeyEventsToggle-importable.web.********************.js`	3.32 kB	0 B
`dotcom-rendering/dist/FocusStyles-importable.web.********************.js`	607 B	0 B
`dotcom-rendering/dist/FollowWrapper-importable.web.********************.js`	3.08 kB	0 B
`dotcom-rendering/dist/FooterLabel-importable.web.********************.js`	336 B	0 B
`dotcom-rendering/dist/frameworks.web.********************.js`	20.8 kB	0 B
`dotcom-rendering/dist/GetCricketScoreboard-importable.web.********************.js`	3.71 kB	0 B
`dotcom-rendering/dist/GetMatchNav-importable.web.********************.js`	9.63 kB	0 B
`dotcom-rendering/dist/GetMatchStats-importable.web.********************.js`	1.73 kB	0 B
`dotcom-rendering/dist/GetMatchTabs-importable.web.********************.js`	2.73 kB	0 B
`dotcom-rendering/dist/guardian-braze-components-banner.web.********************.js`	14.7 kB	0 B
`dotcom-rendering/dist/guardian-braze-components-end-of-article.web.********************.js`	9.29 kB	0 B
`dotcom-rendering/dist/GuideAtomWrapper-importable.web.********************.js`	790 B	0 B
`dotcom-rendering/dist/HeaderTopBar-importable.web.********************.js`	10.8 kB	0 B
`dotcom-rendering/dist/index.web.********************.js`	45.4 kB	-3 B (0%)
`dotcom-rendering/dist/InstagramBlockComponent-importable.web.********************.js`	3.64 kB	0 B
`dotcom-rendering/dist/InteractiveBlockComponent-importable.web.********************.js`	6.06 kB	0 B
`dotcom-rendering/dist/InteractiveContentsBlockComponent-importable.web.********************.js`	3.62 kB	0 B
`dotcom-rendering/dist/InteractiveSupportButton-importable.web.********************.js`	3.88 kB	0 B
`dotcom-rendering/dist/KeyEventsCarousel-importable.web.********************.js`	4.12 kB	0 B
`dotcom-rendering/dist/KnowledgeQuizAtom-importable.web.********************.js`	3.52 kB	0 B
`dotcom-rendering/dist/LatestLinks-importable.web.********************.js`	1.21 kB	0 B
`dotcom-rendering/dist/LightboxHash-importable.web.********************.js`	430 B	0 B
`dotcom-rendering/dist/LightboxJavascript-importable.web.********************.js`	4.44 kB	0 B
`dotcom-rendering/dist/LiveBlogEpic-importable.web.********************.js`	3.93 kB	0 B
`dotcom-rendering/dist/Liveness-importable.web.********************.js`	4.88 kB	0 B
`dotcom-rendering/dist/ManyNewsletterSignUp-importable.web.********************.js`	5.08 kB	0 B
`dotcom-rendering/dist/MapEmbedBlockComponent-importable.web.********************.js`	5.59 kB	0 B
`dotcom-rendering/dist/Metrics-importable.web.********************.js`	2.29 kB	0 B
`dotcom-rendering/dist/MostViewedFooter-importable.web.********************.js`	5.19 kB	0 B
`dotcom-rendering/dist/MostViewedFooterData-importable.web.********************.js`	3.35 kB	0 B
`dotcom-rendering/dist/MostViewedRightWrapper-importable.web.********************.js`	3.87 kB	0 B
`dotcom-rendering/dist/OnwardsUpper-importable.web.********************.js`	4.17 kB	0 B
`dotcom-rendering/dist/PersonalityQuizAtom-importable.web.********************.js`	3.66 kB	0 B
`dotcom-rendering/dist/ProfileAtom-importable.web.********************.js`	547 B	0 B
`dotcom-rendering/dist/ProfileAtomWrapper-importable.web.********************.js`	810 B	0 B
`dotcom-rendering/dist/PulsingDot-importable.web.********************.js`	744 B	0 B
`dotcom-rendering/dist/QandaAtom-importable.web.********************.js`	542 B	0 B
`dotcom-rendering/dist/ReaderRevenueDev-importable.web.********************.js`	466 B	0 B
`dotcom-rendering/dist/readerRevenueDevUtils.web.********************.js`	2.38 kB	0 B
`dotcom-rendering/dist/ReaderRevenueLinks-importable.web.********************.js`	6.23 kB	0 B
`dotcom-rendering/dist/RelativeTime-importable.web.********************.js`	1.92 kB	0 B
`dotcom-rendering/dist/RichLinkComponent-importable.web.********************.js`	6.19 kB	0 B
`dotcom-rendering/dist/SecureSignupIframe-importable.web.********************.js`	4.93 kB	0 B
`dotcom-rendering/dist/SendAMessage-importable.web.********************.js`	4.39 kB	0 B
`dotcom-rendering/dist/SendTargetingParams-importable.web.********************.js`	2.08 kB	0 B
`dotcom-rendering/dist/sentry.web.********************.js`	767 B	0 B
`dotcom-rendering/dist/SetABTests-importable.web.********************.js`	3.42 kB	0 B
`dotcom-rendering/dist/SetAdTargeting-importable.web.********************.js`	481 B	0 B
`dotcom-rendering/dist/shimport.web.********************.js`	2.78 kB	0 B
`dotcom-rendering/dist/ShowHideContainers-importable.web.********************.js`	642 B	0 B
`dotcom-rendering/dist/ShowMore-importable.web.********************.js`	5.69 kB	0 B
`dotcom-rendering/dist/SignInGateMain.web.********************.js`	3.86 kB	0 B
`dotcom-rendering/dist/SignInGateMainCheckoutComplete.web.********************.js`	4.94 kB	0 B
`dotcom-rendering/dist/SignInGateSelector-importable.web.********************.js`	5.55 kB	0 B
`dotcom-rendering/dist/SlotBodyEnd-importable.web.********************.js`	6.57 kB	0 B
`dotcom-rendering/dist/SpotifyBlockComponent-importable.web.********************.js`	5.44 kB	0 B
`dotcom-rendering/dist/StickyBottomBanner-importable.web.********************.js`	5.63 kB	0 B
`dotcom-rendering/dist/SubNav-importable.web.********************.js`	2.36 kB	0 B
`dotcom-rendering/dist/SupportTheG-importable.web.********************.js`	6.35 kB	0 B
`dotcom-rendering/dist/TableOfContents-importable.web.********************.js`	3.09 kB	0 B
`dotcom-rendering/dist/TimelineAtom-importable.web.********************.js`	1.22 kB	0 B
`dotcom-rendering/dist/TweetBlockComponent-importable.web.********************.js`	1.02 kB	0 B
`dotcom-rendering/dist/UnsafeEmbedBlockComponent-importable.web.********************.js`	3.65 kB	0 B
`dotcom-rendering/dist/VideoFacebookBlockComponent-importable.web.********************.js`	5.6 kB	0 B
`dotcom-rendering/dist/VineBlockComponent-importable.web.********************.js`	3.5 kB	0 B
`dotcom-rendering/dist/WeatherWrapper-importable.web.********************.js`	5.42 kB	0 B
`dotcom-rendering/dist/YoutubeBlockComponent-importable.web.********************.js`	4 kB	0 B

_{compressed-size-action}

we never want to have the set of IDs on the server, but we want all version of the hooks on the client to share the same set so as to reduce the number of distinct URLs called.

this way we handle any potential errors from the returned data

prout-bot · 2023-12-20T11:22:38Z

Seen on PROD (merged by @mxdvl 10 minutes and 8 seconds ago) Please check your changes!

github-actions Bot added the dotcom-rendering label Dec 19, 2023

refactor(useCommentCount): hook for server safety

d28be5d

we never want to have the set of IDs on the server, but we want all version of the hooks on the client to share the same set so as to reduce the number of distinct URLs called.

mxdvl force-pushed the mxdvl/ssr-friendly-use-comments-hooks branch from a77cead to d28be5d Compare December 19, 2023 11:53

refactor(CommentCount): parse type

5136424

this way we handle any potential errors from the returned data

mxdvl marked this pull request as ready for review December 20, 2023 09:46

mxdvl requested a review from a team as a code owner December 20, 2023 09:46

sunnyclimber456 approved these changes Dec 20, 2023

View reviewed changes

mxdvl merged commit 4ea838c into main Dec 20, 2023

mxdvl deleted the mxdvl/ssr-friendly-use-comments-hooks branch December 20, 2023 11:12

prout-bot added Pending-on-PROD Seen-on-PROD and removed Pending-on-PROD labels Dec 20, 2023

Navigation Menu

Repository navigation

Refactor `useCommentCount` to rely on hook for window access - #9949

Refactor `useCommentCount` to rely on hook for window access#9949
mxdvl merged 2 commits into
mainfrom
mxdvl/ssr-friendly-use-comments-hooks

mxdvl commented Dec 19, 2023

Uh oh!

github-actions Bot commented Dec 19, 2023 •

edited

Loading

Uh oh!

prout-bot commented Dec 20, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

mxdvl commented Dec 19, 2023

What does this change?

Why?

Uh oh!

github-actions Bot commented Dec 19, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

prout-bot commented Dec 20, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

github-actions Bot commented Dec 19, 2023 •

edited

Loading