4 ms·
Pretty much trivial to implement in react. class Loader extends React.Component { state = { Component: null }; componentWill
by TheCoelacanth 9y ago
Pretty much trivial to implement in react.
class Loader extends React.Component {
state = {
Component: null
};
componentWillMount() {
import('./Component').then(Component => {
this.setState({ Component });
});
}
render() {
const { Component } = this.state;
if (!Component) {
return <div>Loading...</div>;
} else {
return <Component/>;
};
}
}
Might want to add a few lines of error handling for production use, but that is pretty much all you need.
- xab9 9y agoLike the article (presentation) said it's not the best idea to do this with hundreds of components (I think he mentions latency) - in fact you "somehow" have to (should?) bundle things together and then you are back to square one or at least have to hink about pluggability/configuration again.
- TheCoelacanth 9y agoObviously you don't want to use it for every component, you put it in key places where you want lazy loading to happen.