kirillzyusko / react-native-bundle-splitter

HOC for lazy components loading

Home Page:https://kirillzyusko.github.io/react-native-bundle-splitter/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Web support?

kirillzyusko opened this issue · comments

Is your feature request related to a problem? Please describe.

That would be really nice to add the ability to use this library with react-native-web.

Describe the solution you'd like

The same API for both web/mobile projects within one library. Recently Suspense API was released. And according to official docs the proposed way for bundle splitting on web is the usage Suspense + React.lazy. So maybe it's worth to investigate how something similar can be used on react-native side.

Describe alternatives you've considered

There already exist react-loadable library, that help to split bundle on web projects. The API is very similar to API of react-native-bundle-splitter library.

Additional context

The main difference is that react-loadable uses dynamic import syntax (on react-native side we use require). I think this difference can be smoothed out via the usage of babel plugin. However here can be a lot of solutions: one of them can be usage React.lazy API. So it would be better to investigate everything and come up with the best solution.

I think the new version will be published under 2.0.0 version, but I will try to keep the backward compatibility with the 1.x.x version.

Breaking changes

  • it's better to use loader instead of require;
  • investigate now return only initially loaded modules (if use loader instead of require);
  • now screen gets mounted in async way (previously it was in sync way - you pressed a button, it's get freezed and only after that navigation occur, now navigation will occur instantly - as soon as you pressed a button);

Last remaining items from checklist

I'm going to wait a little bit and see, how many new issues will be reported about 2.0.0 version. If everything will be good, I will create PR to others repositories.

Check list

  • Create a demo/example app with react-native-web support;
  • Bring web support to this library - branch - (preload API, investigate on web);
  • Add new example project + add links to this project to README;
  • Test RAM bundles on macos and windows (verify on windows - need to setup dev env for Windows laptop);
  • Write new documentation;
  • Deliver changes to https://reactnative.directory/;
  • Add library to react-navigation community libraries?
  • Publish new release;

Closed in #22