search

apollographql / apollo-client-nextjs

Apollo Client support for the Next.js App Router
https://www.npmjs.com/package/@apollo/experimental-nextjs-app-support
MIT License
352 stars 25 forks source link

RSC preloading mechanism #258

Open phryneas opened 1 month ago

phryneas commented 1 month ago

Resolves #212 and also prepares for #248 a bit.

Previews:

https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/useSuspenseQuery https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/queryRef-useReadQuery https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/queryRef-refTest

On each you can call __APOLLO_CLIENT__[Symbol.for("apollo.suspenseCache")].queryRefs to investigate the queryRefs (if there are any)

github-actions[bot] commented 1 month ago

size-limit report 📦

Path Size
{ ApolloNextAppProvider, NextSSRApolloClient, NextSSRInMemoryCache } from '@apollo/experimental-nextjs-app-support/ssr' (Browser ESM) 7.88 KB (+1.2% 🔺)
{ WrapApolloProvider, ApolloClient, InMemoryCache } from '@apollo/client-react-streaming' (Browser ESM) 1.5 KB (+7.48% 🔺)
{ buildManualDataTransport } from '@apollo/client-react-streaming/manual-transport' (Browser ESM) 6.36 KB (+1.5% 🔺)
@apollo/client-react-streaming (Browser ESM) 2.23 KB (+4.91% 🔺)
@apollo/client-react-streaming (SSR ESM) 2.58 KB (+47.44% 🔺)
@apollo/client-react-streaming (RSC ESM) 1.65 KB (+20.62% 🔺)
@apollo/client-react-streaming/manual-transport (Browser ESM) 6.55 KB (+1.5% 🔺)
@apollo/client-react-streaming/manual-transport (SSR ESM) 7.14 KB (+12.55% 🔺)
@apollo/experimental-nextjs-app-support/ssr (Browser ESM) 8.49 KB (+1% 🔺)
@apollo/experimental-nextjs-app-support/ssr (SSR ESM) 9.12 KB (+9.49% 🔺)
@apollo/experimental-nextjs-app-support/ssr (RSC ESM) 867 B (0%)
@apollo/experimental-nextjs-app-support/rsc (RSC ESM) 626 B (0%)
relativeci[bot] commented 1 month ago

#172 Bundle Size — 1.03MiB (+2.53%).

ba35077(current) vs 882b4ed main#165(baseline)

[!WARNING] Bundle contains 1 duplicate package – View duplicate packages

Bundle metrics  Change 9 changes Regression 3 regressions Improvement 1 improvement
                 Current
#172		      Baseline
#165
Regression  Initial JS 898.47KiB(+0.89%) 890.59KiB
Regression  Initial CSS 70B(+100%) 0B
Change  Cache Invalidation 88.27% 0.03%
Change  Chunks 29(+20.83%) 24
Change  Assets 53(+17.78%) 45
Change  Modules 528(+3.13%) 512
Regression  Duplicate Modules 47(+56.67%) 30
Change  Duplicate Code 2.56%(+98.45%) 1.29%
Improvement  Packages 26(-10.34%) 29
No change  Duplicate Packages 1 1

Bundle size by type  Change 3 changes Regression 3 regressions
|            |       Current
[#172](https://app.relative-ci.com/projects/fukE5WxC5RnzLcZncFJw/jobs/172-0z9YyvtOO8u2qSla5vBW?utm_source=github&utm_medium=pr-report "View bundle analysis report") |      Baseline
[#165](https://app.relative-ci.com/projects/fukE5WxC5RnzLcZncFJw/jobs/165-NMvFXdO7ksS6o1DOjVdN?utm_source=github&utm_medium=pr-report "View baseline bundle analysis report") | |:--|--:|--:| | Regression  [JS](https://app.relative-ci.com/projects/fukE5WxC5RnzLcZncFJw/jobs/172-0z9YyvtOO8u2qSla5vBW/assets?ba=%7B%22filters%22%3A%22ft.CSS-0_ft.JS-1_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-0%22%7D "View JS assets") | `1.02MiB` (`+2.33%`) | `1023.85KiB` | | Regression  [Other](https://app.relative-ci.com/projects/fukE5WxC5RnzLcZncFJw/jobs/172-0z9YyvtOO8u2qSla5vBW/assets?ba=%7B%22filters%22%3A%22ft.CSS-0_ft.JS-0_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-1%22%7D "View Other assets") | `8.06KiB` (`+34.41%`) | `5.99KiB` | | Regression  [CSS](https://app.relative-ci.com/projects/fukE5WxC5RnzLcZncFJw/jobs/172-0z9YyvtOO8u2qSla5vBW/assets?ba=%7B%22filters%22%3A%22ft.CSS-1_ft.JS-0_ft.IMG-0_ft.MEDIA-0_ft.FONT-0_ft.HTML-0_ft.OTHER-0%22%7D "View CSS assets") | `70B` (`+100%`) | `0B` |

Bundle analysis report Branch pr/rsc-preload Project dashboard

phryneas commented 2 weeks ago

Quick thought: we need some warning if people add cookies or headers to context here as that could result in secrets to be dumped into the stream on accident.

vercel[bot] commented 2 weeks ago

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

Name Status Preview Comments Updated (UTC)
apollo-client-nextjs-experimental-nextjs-app-support ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 18, 2024 9:24am
phryneas commented 1 week ago

So here we have some previews:

https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/useSuspenseQuery https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/queryRef-useReadQuery https://apollo-git-32cae2-apollo-client-next-package-integration-tests.vercel.app//rsc/dynamic/PreloadQuery/queryRef-refTest

On each you can call __APOLLO_CLIENT__[Symbol.for("apollo.suspenseCache")].queryRefs to investigate the queryRefs (if there are any)

phryneas commented 1 week ago

Okay, tests in Vercel run fine now, and the error in latest is expected, since that AC release is still missing functionality we require.

I'll do another pass on everything here and then we should be ready for review 🎉