docs(examples): add react 18 example about problem of suspense prerendering siblings #1233

manudeli · 2024-08-23T03:33:12Z

Thanks to @minsour @sonsurim @2-NOW. I added you guys as co-author

changeset-bot · 2024-08-23T03:33:16Z

⚠️ No Changeset found

Latest commit: 0be2113

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

vercel · 2024-08-23T03:33:17Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
suspensive.org	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 23, 2024 6:16am
v1.suspensive.org	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 23, 2024 6:16am
visualization.suspensive.org	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 23, 2024 6:16am

coauthors · 2024-08-23T03:33:17Z

People can be co-author:

Candidate	Reasons	Count	Add this as commit message
@manudeli	#1233 (comment) #1233 (comment) #1233 (review) #1233 (review) #1233 (comment) #1233	6	`Co-authored-by: manudeli <[email protected]>`
@gwansikk	#1233 (comment) #1233 (comment) #1233 (review) #1233 (review)	4	`Co-authored-by: gwansikk <[email protected]>`
@codecov-commenter	#1233 (comment)	1	`Co-authored-by: codecov-commenter <[email protected]>`

github-actions · 2024-08-23T03:52:28Z

Size Change: 0 B

Total Size: 104 kB

ℹ️ View Unchanged

Filename	Size
`packages/cache/dist/Cache.cjs`	1.7 kB
`packages/cache/dist/Cache.js`	129 B
`packages/cache/dist/cacheOptions.cjs`	539 B
`packages/cache/dist/cacheOptions.js`	136 B
`packages/cache/dist/CacheProvider.cjs`	655 B
`packages/cache/dist/CacheProvider.js`	147 B
`packages/cache/dist/chunk-27UYQ7PV.js`	250 B
`packages/cache/dist/chunk-5VXONFWZ.js`	291 B
`packages/cache/dist/chunk-6YXFRBCR.js`	1.2 kB
`packages/cache/dist/chunk-DP7DNUTU.js`	159 B
`packages/cache/dist/chunk-ETI64SK7.js`	244 B
`packages/cache/dist/chunk-QETBZSG5.js`	521 B
`packages/cache/dist/chunk-QQAFR2PG.js`	252 B
`packages/cache/dist/chunk-RN456Z2W.js`	145 B
`packages/cache/dist/index.cjs`	2.2 kB
`packages/cache/dist/index.js`	240 B
`packages/cache/dist/Read.cjs`	982 B
`packages/cache/dist/Read.js`	157 B
`packages/cache/dist/types.cjs`	416 B
`packages/cache/dist/types.js`	66 B
`packages/cache/dist/useCache.cjs`	652 B
`packages/cache/dist/useCache.js`	142 B
`packages/cache/dist/useRead.cjs`	728 B
`packages/cache/dist/useRead.js`	150 B
`packages/jotai/dist/Atom.cjs`	660 B
`packages/jotai/dist/Atom.js`	115 B
`packages/jotai/dist/AtomValue.cjs`	647 B
`packages/jotai/dist/AtomValue.js`	120 B
`packages/jotai/dist/chunk-PEEO4NPV.js`	242 B
`packages/jotai/dist/chunk-W2DXKJF6.js`	264 B
`packages/jotai/dist/chunk-XUG7NR54.js`	242 B
`packages/jotai/dist/index.cjs`	755 B
`packages/jotai/dist/index.js`	158 B
`packages/jotai/dist/SetAtom.cjs`	645 B
`packages/jotai/dist/SetAtom.js`	118 B
`packages/react-dom/dist/chunk-YJUMTHWY.js`	189 B
`packages/react-dom/dist/index.cjs`	602 B
`packages/react-dom/dist/index.js`	122 B
`packages/react-dom/dist/TestText.cjs`	596 B
`packages/react-dom/dist/TestText.js`	119 B
`packages/react-image/dist/chunk-VVVCPJZH.js`	1.11 kB
`packages/react-image/dist/chunk-WGTP75MY.js`	405 B
`packages/react-image/dist/index.cjs`	1.54 kB
`packages/react-image/dist/index.js`	140 B
`packages/react-image/dist/Load.cjs`	1.32 kB
`packages/react-image/dist/Load.js`	126 B
`packages/react-image/dist/SuspenseImage.cjs`	1.53 kB
`packages/react-image/dist/SuspenseImage.js`	137 B
`packages/react-native/dist/chunk-45D2JR5L.js`	205 B
`packages/react-native/dist/index.cjs`	619 B
`packages/react-native/dist/index.js`	122 B
`packages/react-native/dist/TestText.cjs`	612 B
`packages/react-native/dist/TestText.js`	119 B
`packages/react-query-4/dist/chunk-4AU4A5TK.js`	312 B
`packages/react-query-4/dist/chunk-7LC5EH5R.js`	308 B
`packages/react-query-4/dist/chunk-HJAGY6R3.js`	254 B
`packages/react-query-4/dist/chunk-INXQLUAG.js`	151 B
`packages/react-query-4/dist/chunk-JMZC2U4M.js`	306 B
`packages/react-query-4/dist/chunk-NKKRZH3C.js`	269 B
`packages/react-query-4/dist/chunk-P5MROV72.js`	470 B
`packages/react-query-4/dist/chunk-Q4KHEUPO.js`	145 B
`packages/react-query-4/dist/chunk-QETBZSG5.js`	521 B
`packages/react-query-4/dist/chunk-S7L2LUVS.js`	277 B
`packages/react-query-4/dist/chunk-W3SOIIM5.js`	273 B
`packages/react-query-4/dist/index.cjs`	1.61 kB
`packages/react-query-4/dist/index.js`	312 B
`packages/react-query-4/dist/infiniteQueryOptions.cjs`	548 B
`packages/react-query-4/dist/infiniteQueryOptions.js`	144 B
`packages/react-query-4/dist/Mutation.cjs`	821 B
`packages/react-query-4/dist/Mutation.js`	132 B
`packages/react-query-4/dist/QueryErrorBoundary.cjs`	1.12 kB
`packages/react-query-4/dist/QueryErrorBoundary.js`	142 B
`packages/react-query-4/dist/queryOptions.cjs`	540 B
`packages/react-query-4/dist/queryOptions.js`	135 B
`packages/react-query-4/dist/SuspenseInfiniteQuery.cjs`	1.05 kB
`packages/react-query-4/dist/SuspenseInfiniteQuery.js`	154 B
`packages/react-query-4/dist/SuspenseQueries.cjs`	923 B
`packages/react-query-4/dist/SuspenseQueries.js`	149 B
`packages/react-query-4/dist/SuspenseQuery.cjs`	1.04 kB
`packages/react-query-4/dist/SuspenseQuery.js`	147 B
`packages/react-query-4/dist/useSuspenseInfiniteQuery.cjs`	833 B
`packages/react-query-4/dist/useSuspenseInfiniteQuery.js`	147 B
`packages/react-query-4/dist/useSuspenseQueries.cjs`	833 B
`packages/react-query-4/dist/useSuspenseQueries.js`	142 B
`packages/react-query-4/dist/useSuspenseQuery.cjs`	824 B
`packages/react-query-4/dist/useSuspenseQuery.js`	140 B
`packages/react-query-5/dist/chunk-4MX6YXXC.js`	471 B
`packages/react-query-5/dist/chunk-FKG24WFN.js`	170 B
`packages/react-query-5/dist/chunk-G4UWQXSU.js`	310 B
`packages/react-query-5/dist/chunk-GXSI7FXZ.js`	306 B
`packages/react-query-5/dist/chunk-KI4RNNHO.js`	173 B
`packages/react-query-5/dist/chunk-LHMCCR64.js`	262 B
`packages/react-query-5/dist/chunk-LQDNL5GK.js`	172 B
`packages/react-query-5/dist/chunk-QETBZSG5.js`	521 B
`packages/react-query-5/dist/chunk-RX5QN4OH.js`	167 B
`packages/react-query-5/dist/chunk-XFQQRL67.js`	319 B
`packages/react-query-5/dist/chunk-XRWCGESR.js`	168 B
`packages/react-query-5/dist/index.cjs`	1.56 kB
`packages/react-query-5/dist/index.js`	309 B
`packages/react-query-5/dist/infiniteQueryOptions.cjs`	573 B
`packages/react-query-5/dist/infiniteQueryOptions.js`	144 B
`packages/react-query-5/dist/Mutation.cjs`	821 B
`packages/react-query-5/dist/Mutation.js`	132 B
`packages/react-query-5/dist/QueryErrorBoundary.cjs`	1.12 kB
`packages/react-query-5/dist/QueryErrorBoundary.js`	142 B
`packages/react-query-5/dist/queryOptions.cjs`	563 B
`packages/react-query-5/dist/queryOptions.js`	136 B
`packages/react-query-5/dist/SuspenseInfiniteQuery.cjs`	833 B
`packages/react-query-5/dist/SuspenseInfiniteQuery.js`	145 B
`packages/react-query-5/dist/SuspenseQueries.cjs`	671 B
`packages/react-query-5/dist/SuspenseQueries.js`	139 B
`packages/react-query-5/dist/SuspenseQuery.cjs`	825 B
`packages/react-query-5/dist/SuspenseQuery.js`	137 B
`packages/react-query-5/dist/useSuspenseInfiniteQuery.cjs`	577 B
`packages/react-query-5/dist/useSuspenseInfiniteQuery.js`	148 B
`packages/react-query-5/dist/useSuspenseQueries.cjs`	571 B
`packages/react-query-5/dist/useSuspenseQueries.js`	142 B
`packages/react-query-5/dist/useSuspenseQuery.cjs`	569 B
`packages/react-query-5/dist/useSuspenseQuery.js`	140 B
`packages/react-query-next-experimental-4/dist/chunk-K4SC4YJQ.js`	796 B
`packages/react-query-next-experimental-4/dist/chunk-RGU7T7L7.js`	570 B
`packages/react-query-next-experimental-4/dist/chunk-UMGX6KRV.js`	999 B
`packages/react-query-next-experimental-4/dist/htmlescape.cjs`	656 B
`packages/react-query-next-experimental-4/dist/htmlescape.js`	133 B
`packages/react-query-next-experimental-4/dist/HydrationStreamProvider.cjs`	1.74 kB
`packages/react-query-next-experimental-4/dist/HydrationStreamProvider.js`	155 B
`packages/react-query-next-experimental-4/dist/index.cjs`	2.37 kB
`packages/react-query-next-experimental-4/dist/index.js`	163 B
`packages/react-query-next-experimental-4/dist/ReactQueryStreamedHydration.cjs`	2.37 kB
`packages/react-query-next-experimental-4/dist/ReactQueryStreamedHydration.js`	164 B
`packages/react-query-next-experimental/dist/index.cjs`	595 B
`packages/react-query-next-experimental/dist/index.js`	161 B
`packages/react-query/dist/index.cjs`	551 B
`packages/react-query/dist/index.js`	121 B
`packages/react-query/dist/v4.cjs`	550 B
`packages/react-query/dist/v4.js`	116 B
`packages/react-query/dist/v5.cjs`	550 B
`packages/react-query/dist/v5.js`	116 B
`packages/react/dist/chunk-2YNK4Y6O.js`	819 B
`packages/react/dist/chunk-3L5P33J5.js`	414 B
`packages/react/dist/chunk-6NAWCGK4.js`	596 B
`packages/react/dist/chunk-CD5YPUNF.js`	1.57 kB
`packages/react/dist/chunk-CTXF3WOZ.js`	246 B
`packages/react/dist/chunk-D7NO3THF.js`	666 B
`packages/react/dist/chunk-HVDFXOFP.js`	414 B
`packages/react/dist/chunk-INLOGI26.js`	282 B
`packages/react/dist/chunk-KBH2PMLJ.js`	578 B
`packages/react/dist/chunk-NF2UFYHD.js`	433 B
`packages/react/dist/chunk-TTRGFZ2C.js`	136 B
`packages/react/dist/chunk-TWMWHMZ5.js`	353 B
`packages/react/dist/chunk-UHZ42BSU.js`	448 B
`packages/react/dist/chunk-WQJTGHBN.js`	517 B
`packages/react/dist/ClientOnly.cjs`	736 B
`packages/react/dist/ClientOnly.js`	141 B
`packages/react/dist/DefaultProps.cjs`	1.05 kB
`packages/react/dist/DefaultProps.js`	167 B
`packages/react/dist/Delay.cjs`	1.11 kB
`packages/react/dist/Delay.js`	149 B
`packages/react/dist/DevMode.cjs`	530 B
`packages/react/dist/DevMode.js`	131 B
`packages/react/dist/ErrorBoundary.cjs`	2.67 kB
`packages/react/dist/ErrorBoundary.js`	206 B
`packages/react/dist/ErrorBoundaryGroup.cjs`	1.37 kB
`packages/react/dist/ErrorBoundaryGroup.js`	180 B
`packages/react/dist/index.cjs`	4.12 kB
`packages/react/dist/index.js`	369 B
`packages/react/dist/Suspense.cjs`	1.3 kB
`packages/react/dist/Suspense.js`	172 B
`packages/react/dist/Suspensive.cjs`	1.26 kB
`packages/react/dist/Suspensive.js`	175 B
`packages/react/dist/wrap.cjs`	3.6 kB
`packages/react/dist/wrap.js`	210 B
`packages/utils/dist/chunk-5XT623M4.js`	263 B
`packages/utils/dist/chunk-FWXVSCJA.js`	125 B
`packages/utils/dist/chunk-OSQ3QLKJ.js`	276 B
`packages/utils/dist/chunk-PKN4LMAV.js`	137 B
`packages/utils/dist/chunk-TUVDYELP.js`	191 B
`packages/utils/dist/ConstructorType.cjs`	424 B
`packages/utils/dist/ConstructorType.js`	76 B
`packages/utils/dist/increase.cjs`	533 B
`packages/utils/dist/increase.js`	119 B
`packages/utils/dist/index.cjs`	1.58 kB
`packages/utils/dist/index.js`	926 B
`packages/utils/dist/noop.cjs`	522 B
`packages/utils/dist/noop.js`	115 B
`packages/utils/dist/Nullable.cjs`	419 B
`packages/utils/dist/Nullable.js`	69 B
`packages/utils/dist/OmitKeyof.cjs`	420 B
`packages/utils/dist/OmitKeyof.js`	70 B
`packages/utils/dist/RequiredKeyof.cjs`	425 B
`packages/utils/dist/RequiredKeyof.js`	74 B
`packages/utils/dist/useIsomorphicLayoutEffect.cjs`	588 B
`packages/utils/dist/useIsomorphicLayoutEffect.js`	136 B
`packages/utils/dist/usePreservedCallback.cjs`	697 B
`packages/utils/dist/usePreservedCallback.js`	144 B
`packages/utils/dist/useTimeout.cjs`	769 B
`packages/utils/dist/useTimeout.js`	144 B

_{compressed-size-action}

codspeed-hq · 2024-08-23T03:52:58Z

CodSpeed Performance Report

Merging #1233 will create unknown performance changes

_{Comparing examples/react19-suspense-waterfall (0be2113) with main (454bbc6)}

Summary

⚠️ No benchmarks were detected in both the base of the PR and the PR.

codecov-commenter · 2024-08-23T03:54:01Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 70.57%. Comparing base (454bbc6) to head (0be2113).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1233   +/-   ##
=======================================
  Coverage   70.57%   70.57%           
=======================================
  Files          70       70           
  Lines         656      656           
  Branches      132      131    -1     
=======================================
  Hits          463      463           
  Misses        171      171           
  Partials       22       22

Components	Coverage Δ
@suspensive/utils	`47.16% <ø> (ø)`
@suspensive/react	`100.00% <ø> (ø)`
@suspensive/react-dom	`100.00% <ø> (ø)`
@suspensive/react-native	`100.00% <ø> (ø)`
@suspensive/react-query	`72.09% <ø> (ø)`
@suspensive/react-query-4	`0.00% <ø> (ø)`
@suspensive/react-query-5	`0.00% <ø> (ø)`
@suspensive/react-query-next-experimental	`∅ <ø> (∅)`
@suspensive/react-query-next-experimental-4	`6.15% <ø> (ø)`
@suspensive/jotai	`0.00% <ø> (ø)`
@suspensive/cache	`98.01% <ø> (ø)`
@suspensive/react-image	`80.39% <ø> (ø)`

Co-authored-by: Minsoo Park <[email protected]> Co-authored-by: 2-NOW <[email protected]> Co-authored-by: Sonny <[email protected]>

gwansikk

Everything is perfect! 👍👍
@minsour @sonsurim @2-NOW Thank you!

examples/vite-react-18-suspense-waterfall/index.html

Co-authored-by: GwanSik Kim <[email protected]>

manudeli · 2024-08-23T06:16:02Z

@gwansikk @minsour @sonsurim @2-NOW I renamed this as "Problem of suspense prerendering siblings" than "suspense waterfall". it's clear than before

manudeli self-assigned this Aug 23, 2024

manudeli linked an issue Aug 23, 2024 that may be closed by this pull request

[Feature]: Example for suspense waterfall of React 18, 19 #1232

Closed

manudeli requested a review from gwansikk August 23, 2024 03:33

github-actions bot added eslint dependencies examples labels Aug 23, 2024

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 03:34 View deployment

vercel bot deployed to Preview – suspensive.org August 23, 2024 03:36 View deployment

manudeli force-pushed the examples/react19-suspense-waterfall branch from 9bd10ae to 67d7b9a Compare August 23, 2024 03:37

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 03:38 View deployment

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 03:38 View deployment

manudeli marked this pull request as draft August 23, 2024 03:38

vercel bot deployed to Preview – suspensive.org August 23, 2024 03:39 View deployment

manudeli force-pushed the examples/react19-suspense-waterfall branch from 67d7b9a to 2894fe5 Compare August 23, 2024 03:43

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 03:44 View deployment

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 03:46 View deployment

vercel bot deployed to Preview – suspensive.org August 23, 2024 03:47 View deployment

manudeli force-pushed the examples/react19-suspense-waterfall branch from 2894fe5 to cc17376 Compare August 23, 2024 03:50

vercel bot deployed to Preview – suspensive.org August 23, 2024 03:51 View deployment

manudeli marked this pull request as ready for review August 23, 2024 03:51

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 03:52 View deployment

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 03:52 View deployment

docs(examples): add react 18, 19 comparison about suspense waterfall

8a48826

Co-authored-by: Minsoo Park <[email protected]> Co-authored-by: 2-NOW <[email protected]> Co-authored-by: Sonny <[email protected]>

manudeli force-pushed the examples/react19-suspense-waterfall branch from cc17376 to 8a48826 Compare August 23, 2024 03:54

vercel bot deployed to Preview – suspensive.org August 23, 2024 03:54 View deployment

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 03:55 View deployment

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 03:56 View deployment

manudeli changed the title ~~docs(examples): add react 18, 19 comparison about suspense waterfall~~ docs(examples): add react 18 example about suspense waterfall Aug 23, 2024

gwansikk approved these changes Aug 23, 2024

View reviewed changes

examples/vite-react-18-suspense-waterfall/index.html Outdated Show resolved Hide resolved

Update examples/vite-react-18-suspense-waterfall/index.html

0caee78

Co-authored-by: GwanSik Kim <[email protected]>

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 06:10 View deployment

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 06:11 View deployment

vercel bot deployed to Preview – suspensive.org August 23, 2024 06:11 View deployment

manudeli changed the title ~~docs(examples): add react 18 example about suspense waterfall~~ docs(examples): add react 18 example about problem of suspense prerendering siblings of suspended component Aug 23, 2024

chore: update

0be2113

vercel bot deployed to Preview – visualization.suspensive.org August 23, 2024 06:15 View deployment

vercel bot deployed to Preview – suspensive.org August 23, 2024 06:16 View deployment

manudeli changed the title ~~docs(examples): add react 18 example about problem of suspense prerendering siblings of suspended component~~ docs(examples): add react 18 example about problem of suspense prerendering siblings Aug 23, 2024

vercel bot deployed to Preview – v1.suspensive.org August 23, 2024 06:16 View deployment

manudeli merged commit c403372 into main Aug 23, 2024
18 checks passed

manudeli deleted the examples/react19-suspense-waterfall branch August 23, 2024 06:18

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

docs(examples): add react 18 example about problem of suspense prerendering siblings #1233

docs(examples): add react 18 example about problem of suspense prerendering siblings #1233

manudeli commented Aug 23, 2024 •

edited

Loading

changeset-bot bot commented Aug 23, 2024 •

edited

Loading

vercel bot commented Aug 23, 2024 •

edited

Loading

coauthors bot commented Aug 23, 2024 •

edited

Loading

github-actions bot commented Aug 23, 2024 •

edited

Loading

codspeed-hq bot commented Aug 23, 2024 •

edited

Loading

codecov-commenter commented Aug 23, 2024 •

edited

Loading

gwansikk left a comment

manudeli commented Aug 23, 2024 •

edited

Loading

docs(examples): add react 18 example about problem of suspense prerendering siblings #1233

docs(examples): add react 18 example about problem of suspense prerendering siblings #1233

Conversation

manudeli commented Aug 23, 2024 • edited Loading

changeset-bot bot commented Aug 23, 2024 • edited Loading

⚠️ No Changeset found

vercel bot commented Aug 23, 2024 • edited Loading

coauthors bot commented Aug 23, 2024 • edited Loading

People can be co-author:

github-actions bot commented Aug 23, 2024 • edited Loading

codspeed-hq bot commented Aug 23, 2024 • edited Loading

CodSpeed Performance Report

Merging #1233 will create unknown performance changes

Summary

codecov-commenter commented Aug 23, 2024 • edited Loading

Codecov Report

gwansikk left a comment

Choose a reason for hiding this comment

manudeli commented Aug 23, 2024 • edited Loading

manudeli commented Aug 23, 2024 •

edited

Loading

changeset-bot bot commented Aug 23, 2024 •

edited

Loading

vercel bot commented Aug 23, 2024 •

edited

Loading

coauthors bot commented Aug 23, 2024 •

edited

Loading

github-actions bot commented Aug 23, 2024 •

edited

Loading

codspeed-hq bot commented Aug 23, 2024 •

edited

Loading

codecov-commenter commented Aug 23, 2024 •

edited

Loading

manudeli commented Aug 23, 2024 •

edited

Loading