Hacker News new | past | comments | ask | show | jobs | submit login

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.



Like 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.


Obviously you don't want to use it for every component, you put it in key places where you want lazy loading to happen.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: