Update recommended React toolchains, add Vite. #3828
Conversation
|
Hi @leerob! Thank you for your pull request and welcome to our community. Action RequiredIn order to merge any pull request (code, docs, etc.), we require contributors to sign our Contributor License Agreement, and we don't seem to have one on file for you. ProcessIn order for us to review and merge your suggested changes, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA. Once the CLA is signed, our tooling will perform checks and validations. Afterwards, the pull request will be tagged with If you have received this in error or have any questions, please contact us at cla@fb.com. Thanks! |
|
✔️ Deploy Preview for reactjs ready! 🔨 Explore the source changes: 2a7455c 🔍 Inspect the deploy log: https://app.netlify.com/sites/reactjs/deploys/61097f17560765000794225d 😎 Browse the preview: https://deploy-preview-3828--reactjs.netlify.app |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks! |
|
Thanks for your contribution—it's very close to the new page for the new site! We were considering updating the current content, but now we will have to consider just merging your contribution! |
|
@rachelnabors Anything else you need from me here? |
|
|
||
| Learn Gatsby from [its official guide](https://www.gatsbyjs.org/docs/) and a [gallery of starter kits](https://www.gatsbyjs.org/docs/gatsby-starters/). | ||
|
|
||
| ### Create React App {#create-react-app} | ||
|
|
||
| [Create React App](https://github.com/facebookincubator/create-react-app) is framework for **small, [single-page](/docs/glossary.html#single-page-application) applications** in React. |
There was a problem hiding this comment.
I suggest to keep old description here, but remove "comfortable" and best". Something like this:
Create React App is a pre-configured environment which lets you start building single-page application or just learning React without configuring build tools like webpack or Babel.
My main concerns with proposed version are:
is framework
It puts CRA on the same shelf with Next.js and Gatsby, but CRA provides almost no guidelines on app structure. Maybe it can serve as a difference here instead: if you want a framework, use Next.js or Gatsby.
for small applications
I'd say size should not be differentiating point here. CRA can be a suitable choice for medium-sized or even large apps unless you need to configure something in underlying tools.
Seems like "small" here means "simple" or even "quite typical single-page app with predictable build tooling requirements" :)
There was a problem hiding this comment.
@44px Would you prefer changing "small" to "non-production" to match Dan's comment?
...starting with 2.0, [CRA is] mostly in maintenance mode and does not strive to be the best tool for production React apps. It is a tool to get started and get something running fast. Perhaps, it's not even best at that anymore.
There was a problem hiding this comment.
I'm afraid it can nudge someone to build app with custom webpack config because they have "production" app :)
For the last year I saw at least two apps with config problems:
- One had broken caching because of improperly set chunk name
- Second had large production bundle because of inlined source maps
Both problems have simple fixes, but they might not happen at all if these apps were built with CRA. And they could, these were "simple" apps.
I still see the CRA as the only option if you need to build "classic SPA". It provides good DX (TypeScript support, Fast Refresh, babel-macro, using SVGs as React components, detection of CSS modules, REACT_APP_* env vars substitution) and produces optimized production bundles.
There was a problem hiding this comment.
Should we add the "without configuring build tools like webpack or Babel" to the Next.js and Gastby descriptions too?
There was a problem hiding this comment.
Good point! We don't need to say this at all because all tools from "Recommended Toolchains" section are zero-config.
|
Is there a chance we could get Vite listed under "The React team primarily recommends these solutions" alongside |
|
Hey @rachelnabors! Wanted to check in here. Anything more you need from me? |
|
Can you rebase your changes please? |
|
@harish-sethuraman done, thank you! |
Size Changes📦 Next.js Bundle AnalysisThis analysis was generated by the next.js bundle analysis action 🤖 This PR introduced no changes to the javascript bundle 🙌 |
| - If you're building a **static content-oriented website,** try [Gatsby](#gatsby). | ||
| - If you're building a **static or server-rendered application,** use [Next.js](#nextjs). | ||
| - If you're building a **static content-oriented website,** use [Gatsby](#gatsby). | ||
| - If you're building a **[single-page app](/docs/glossary.html#single-page-application)**, use [Create React App](#create-react-app). |
There was a problem hiding this comment.
In the beta.reactjs.org we still recommend create-react-app if they are just getting started. Not sure how @gaearon feels about this? We might want to make it consistent in both sites.
|
How do you feel about the messaging on the new site? I think it's confusing that we have the newer messaging there, and now we have an intermediate version. Would this PR still be valuable after the beta website ships? |
|
From the new messaging:
My only confusion is that this seems to conflict with this comment.
|
|
@leerob Hi, was closing this intentional? |
|
Oh whoops, yeah I forgot that would happen. I was cleaning up my mess of forked repos. I'll defer to Dan – happy to roll this forward to the news docs site. |
This PR was sparked by this comment in the CRA repo: facebook/create-react-app#11180 (comment)
I've updated the docs to reflect this. I've also tried to remove words like "popular" (describing Next.js) and "best" (describing Gatsby) to be more unopinionated. I tried to be as unbiased as possible, so please suggest any changes that could make this more clear.