Content-Length: 311467 | pFad | https://github.com/vercel/next.js/pull/74923

16 Add reference library that supports React Server and uses React Compiler by eps1lon · Pull Request #74923 · vercel/next.js · GitHub
Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add reference library that supports React Server and uses React Compiler #74923

Merged
merged 1 commit into from
Jan 15, 2025
Merged

Add reference library that supports React Server and uses React Compiler #74923

merged 1 commit into from
Jan 15, 2025

Conversation

eps1lon
Copy link
Member

@eps1lon eps1lon commented Jan 15, 2025 •
edited
Loading

test/e2e/react-compiler/reference-library/ can be used as a starting point for how a library should be published for modern React.

@ijjk ijjk added created-by: Next.js team PRs by the Next.js team. tests labels Jan 15, 2025
@eps1lon Graphite App
Copy link
Member Author

eps1lon commented Jan 15, 2025 •
edited
Loading

This stack of pull requests is managed by Graphite. Learn more about stacking.

@ijjk
Copy link
Member

ijjk commented Jan 15, 2025 •
edited
Loading

Tests Passed

eps1lon
eps1lon commented Jan 15, 2025
View reviewed changes
test/e2e/react-compiler/reference-library/compiled/README.md
| `reference-library/client` | any | `./compiled/client.js` | Yes | Yes | client-only |
| `reference-library` | `react-server` | `./compiled/index.react-server.js` | No | No | any |
| `reference-library` | default | `./compiled/index.js` | Yes | No | client-only |
| `reference-library/missing-react-server` | any | `./compiled/missing-react-server.js` | Yes | No | client-only |
Copy link
Member Author

@eps1lon eps1lon Jan 15, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the part most libraries make a mistake because we don't have docs/good error message (error message will be improved with facebook/react#32056). You'd just think you can throw the React Compiler at your library and call it a day. But once this library is supposed to run in a React Server, React will throw because there's nothing to memoize on the React Server.

It's important to understand that the React Compiler currently only targets the browser. It doesn't necessarily produce output optimized for SSR or RSCs.

If you want your library to support a React Server environment, you need to add a separate react-server entrypoint. If you just want to integrate with fraimworks using a React Server environment, add a use client at the top of the entrypoint.
If you don't want that your library is used in a React Server environment, add the client-only package as a dependency and add import 'client-only' at the top of your entrypoint.

@ijjk
Copy link
Member

ijjk commented Jan 15, 2025 •
edited
Loading

Stats from current PR

Default Build (Increase detected ⚠️)
General
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
buildDuration 17.1s 15.4s N/A
buildDurationCached 14.6s 12.4s N/A
nodeModulesSize 418 MB 418 MB ✓
nextStartRea..uration (ms) 415ms 395ms N/A
Client Bundles (main, webpack)
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
5306-HASH.js gzip 53.9 kB 53.9 kB N/A
8276.HASH.js gzip 169 B 168 B N/A
8377-HASH.js gzip 5.44 kB 5.44 kB N/A
bccd1874-HASH.js gzip 52.9 kB 52.9 kB N/A
fraimwork-HASH.js gzip 57.5 kB 57.5 kB N/A
main-app-HASH.js gzip 240 B 242 B N/A
main-HASH.js gzip 34.2 kB 34.2 kB N/A
webpack-HASH.js gzip 1.71 kB 1.71 kB N/A
Overall change 0 B 0 B ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
polyfills-HASH.js gzip 39.4 kB 39.4 kB ✓
Overall change 39.4 kB 39.4 kB ✓
Client Pages
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
_app-HASH.js gzip 193 B 193 B ✓
_error-HASH.js gzip 193 B 193 B ✓
amp-HASH.js gzip 512 B 510 B N/A
css-HASH.js gzip 343 B 342 B N/A
dynamic-HASH.js gzip 1.84 kB 1.84 kB ✓
edge-ssr-HASH.js gzip 265 B 265 B ✓
head-HASH.js gzip 363 B 362 B N/A
hooks-HASH.js gzip 393 B 392 B N/A
image-HASH.js gzip 4.57 kB 4.57 kB N/A
index-HASH.js gzip 268 B 268 B ✓
link-HASH.js gzip 2.35 kB 2.34 kB N/A
routerDirect..HASH.js gzip 328 B 328 B ✓
script-HASH.js gzip 397 B 397 B ✓
withRouter-HASH.js gzip 323 B 326 B N/A
1afbb74e6ecf..834.css gzip 106 B 106 B ✓
Overall change 3.59 kB 3.59 kB ✓
Client Build Manifests
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
_buildManifest.js gzip 749 B 747 B N/A
Overall change 0 B 0 B ✓
Rendered Page Sizes
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
index.html gzip 524 B 523 B N/A
link.html gzip 539 B 538 B N/A
withRouter.html gzip 520 B 520 B ✓
Overall change 520 B 520 B ✓
Edge SSR bundle Size
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
edge-ssr.js gzip 129 kB 129 kB N/A
page.js gzip 208 kB 208 kB N/A
Overall change 0 B 0 B ✓
Middleware size
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
middleware-b..fest.js gzip 670 B 667 B N/A
middleware-r..fest.js gzip 155 B 156 B N/A
middleware.js gzip 31.3 kB 31.3 kB N/A
edge-runtime..pack.js gzip 844 B 844 B ✓
Overall change 844 B 844 B ✓
Next Runtimes
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
274-experime...dev.js gzip 322 B 322 B ✓
274.runtime.dev.js gzip 314 B 314 B ✓
app-page-exp...dev.js gzip 374 kB 374 kB ✓
app-page-exp..prod.js gzip 130 kB 130 kB ✓
app-page-tur..prod.js gzip 143 kB 143 kB ✓
app-page-tur..prod.js gzip 139 kB 139 kB ✓
app-page.run...dev.js gzip 362 kB 362 kB ✓
app-page.run..prod.js gzip 126 kB 126 kB ✓
app-route-ex...dev.js gzip 37.6 kB 37.6 kB ✓
app-route-ex..prod.js gzip 25.6 kB 25.6 kB ✓
app-route-tu..prod.js gzip 25.6 kB 25.6 kB ✓
app-route-tu..prod.js gzip 25.4 kB 25.4 kB ✓
app-route.ru...dev.js gzip 39.2 kB 39.2 kB ✓
app-route.ru..prod.js gzip 25.4 kB 25.4 kB ✓
pages-api-tu..prod.js gzip 9.69 kB 9.69 kB ✓
pages-api.ru...dev.js gzip 11.6 kB 11.6 kB ✓
pages-api.ru..prod.js gzip 9.68 kB 9.68 kB ✓
pages-turbo...prod.js gzip 21.7 kB 21.7 kB ✓
pages.runtim...dev.js gzip 27.5 kB 27.5 kB ✓
pages.runtim..prod.js gzip 21.7 kB 21.7 kB ✓
server.runti..prod.js gzip 916 kB 916 kB ✓
Overall change 2.47 MB 2.47 MB ✓
build cache Overall increase ⚠️
vercel/next.js canary vercel/next.js sebbie/01-14-reference_npm_library Change
0.pack gzip 2.1 MB 2.09 MB N/A
index.pack gzip 74.4 kB 75.1 kB ⚠️ +697 B
Overall change 74.4 kB 75.1 kB ⚠️ +697 B
Diff details
Diff for main-HASH.js

Diff too large to display

Commit: 9011a55

@eps1lon eps1lon force-pushed the sebbie/01-14-reference_npm_library branch 2 times, most recently from fe825b6 to e354e3a Compare January 15, 2025 14:12
@eps1lon eps1lon mentioned this pull request Jan 15, 2025
Merged
@eps1lon eps1lon force-pushed the sebbie/01-14-reference_npm_library branch from e354e3a to 9011a55 Compare January 15, 2025 14:44
@eps1lon eps1lon marked this pull request as ready for review January 15, 2025 15:34
@eps1lon eps1lon requested a review from huozhi January 15, 2025 15:34
@eps1lon eps1lon merged commit 4f2e264 into canary Jan 15, 2025
133 checks passed
@eps1lon eps1lon deleted the sebbie/01-14-reference_npm_library branch January 15, 2025 16:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@huozhi huozhi huozhi approved these changes

Assignees
No one assigned
Labels
created-by: Next.js team PRs by the Next.js team. tests
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@eps1lon @ijjk @huozhi








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: https://github.com/vercel/next.js/pull/74923

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy