Skip to content

React.lazy #13398

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.

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

Merged
merged 1 commit into from
Aug 16, 2018
Merged

React.lazy #13398

merged 1 commit into from
Aug 16, 2018

Conversation

acdlite
Copy link
Collaborator

@acdlite acdlite commented Aug 14, 2018

Based on #13397

Lazily starts loading a component the first time it's rendered. The implementation is fairly simple and could be left to userspace, but since this is an important use case, there's value in standardization.

Final name is TBD. I went with lazy for now because it's short and descriptive.

I put it on the main React export because it's small and importing this at the top of every file will get old really quickly.

@pull-bot
Copy link

pull-bot commented Aug 14, 2018

Details of bundled changes.

Comparing: 2b30828...a15d2a0

react

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react.development.js +0.7% +0.8% 59.26 KB 59.68 KB 16.57 KB 16.71 KB UMD_DEV
react.development.js +0.8% +0.9% 53.45 KB 53.87 KB 14.74 KB 14.87 KB NODE_DEV
React-dev.js +0.8% +1.0% 51.12 KB 51.54 KB 14.09 KB 14.24 KB FB_WWW_DEV
React-prod.js 🔺+2.1% 🔺+2.4% 13.64 KB 13.92 KB 3.79 KB 3.88 KB FB_WWW_PROD

Generated by 🚫 dangerJS

Copy link
Collaborator

@sebmarkbage sebmarkbage left a comment

Choose a reason for hiding this comment

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

Pending changes on the base PR, but this one makes sense.

// Lazily create thenable by wrapping in an extra thenable.
thenable = ctor();
}
thenable.then(resolve, reject);
Copy link
Collaborator

Choose a reason for hiding this comment

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

Even though we don't use the return value, others might want to. So it might be worth returning the result of this.

@acdlite acdlite force-pushed the lazy branch 4 times, most recently from 15395e7 to 5af9d75 Compare August 15, 2018 20:58
then(resolve, reject) {
if (thenable === null) {
// Lazily create thenable by wrapping in an extra thenable.
thenable = ctor();
Copy link
Collaborator

Choose a reason for hiding this comment

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

It would be good to set the closed over variable (ctor) to null so that it can be GC:ed since it won't be used anymore.

Lazily starts loading a component the first time it's rendered. The
implementation is fairly simple and could be left to userspace, but since
this is an important use case, there's value in standardization.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants