Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Code splitting with Onsen React TabBar

  • Hey folks. I’m trying to setup webpack code splitting with Onsen React TabBars, but the TabBar is either architected so it won’t work, or I don’t know how to do it.

    What I’m finding is that each Tab page is rendered even if it’s not the active tab. This causes a huge slowdown in our app.

    Is there a way of lazily loading the page associated with the tab when the tab becomes active?



  • @sherscher Do you have a lot of elements on the tabs? I believe all tabs are now loaded at runtime and remain persistent. If you have a lot of data that will inherently slow down the app, I usually use the show or postchange event to load it when the tab is changed.

  • Yea, each tab is almost an app unto itself. The load time is really bad. Will try to get on-demand loading working.


  • After using webpack to split each tab’s code into a separate chunk, the load time is pretty good again.