MobX 7

[kubk]

#3796

• remove legacy decorators
• remove non-proxy support
  • remove stub array: StubArray workaround is incompatible with terser's unsafe_arrows option #3825
• clean up old code from mobx-react and mobx-react-lite (class components are still supported)
  • remove deprecated hooks
  • remove prop types
• removed unstable_batchedUpdates (both react web & react native do it automatically). new tests included proving it's no longer needed
• remove provider / inject. new tests included for the react + context usage
  • document how to migrate to react context instead. for both function components and class components
• remove trace
• drop react <=17
• v7 migration guide
• update all documentation
• upgrade build tooling to use plain rollup. keep CJS and modern ESM
• scripts to check code splitting
• split comparer.* into compare* as well as flow.* / action.* into flow* / action* etc for better tree-shaking: Add computed.shallow annotation #2986

Package	Before	After	Reduction %
mobx bundle ESM	17.02 KiB	14.19 KiB	16.6%
mobx minimal* ESM	14.66 KiB	11.22 KiB	23.5%
mobx-react-lite	1.81 KiB	1.53 KiB	15.5%
mobx-react	3.71 KiB	1.79 KiB	51.8%

*minimal only exports observable, action, computed, and autorun. All the measurement scripts are in the PR.

Honestly, I expected better gains. That is why I also tried a more aggressive change - removing decorators from the main bundle entirely and moving them into a separate mobx/decorator module. To my surprise, that only saved about 0.8 KB gzipped

Yet this required a pretty serious overhaul of the library internals, and I'm not sure it is stable enough to release. Considering the very modest gains, I called this out. The PR doesn't include it.

In general the V7 should be pretty safe to migrate to, as it's mostly cleanup

[changeset-bot]

🦋 Changeset detected

Latest commit: 3b1a872

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
mobx	Major
mobx-react-lite	Major
mobx-react	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[kubk]

@mweststrate Thank you so much for reviewing the PR! The mobx is even thinner now! 8cdd873

I've addressed all the comments and I am sure we can release it as beta! The only unsolved issue is this one and I'd appreciate your help here: #4671 (comment)

[mweststrate]

I've gotten a bit swamped atm, will try to take a look near the end of the week!

[kubk]

@mweststrate Thanks! I know i've just added a bit more to your review pile since last time, but the payoff is that minimal MobX is just 11.2 KB gzipped!

Unified diff for the last couple of commits: https://github.com/mobxjs/mobx/pull/4671/changes/e08d360dc9aee0f172e28d0508f3f2170650addd..HEAD (it's always up-to-date)

Notes:

• Having separate functions like observableDeep, compareShallow instead of observable.deep and comparer.shallow allows us to reduce the bundle size. I've checked whether it affects MST and noticed that MST used outdated observable.ref.enhancer. Reported an issue: observable.ref.enhancer is gone, MSTMap may need a local ref enhancer mobx-state-tree#2292 The issue existed before this PR.
• React Native now supports globalThis so we can simplify the getGlobal()
• neither MST nor mobx-keystone use the the ObservableValue.enhancer / ObservableValue.equals. Than means we can rename them for property mangling

[js2me]

Amazing PR!
LGTM

[merlinaudio]

amazing ✨🚀

thank you for working on this :)

[mweststrate]

@kubk

ObservableValue.enhancer

If MST doesn't use it anymore (that is what is was introduced for), I think we could drop the feature just altogether. At it's core it is a feature that should imho be solved in userland, not inside the library, and it will remove a bunch of indirection / inefficiency in how values are processed.

[mweststrate]

The other changes look great!

[mweststrate]

Beyond that LGTM! Happy to help with further merge and release / version number coordination. Not surely entirely how I did that with previous majors, but muscle memory will hopefully return when going through the motions :). So let me know when you're happy @kubk and I can merge & cut.

[kubk]

@mweststrate Thanks!

It does seem that ObservableValue.enhancer can be removed, but I won’t be able to find the time to properly clean it up in the next couple of weeks and I don't want that to become a blocker for the v7 release. So if the rest looks ok, please proceed with the merge and the beta release!

Also I was hoping we could get the minimal MobX example to ~10 kB gzip (a beautiful number!) I tried many different approaches to reduce the output size. Some helped, some didnt and at this point I'm out of ideas

If you see any obvious size wins, i'd really appreciate your help there too. There's npm run check-size script in the repo root now

[mweststrate]

I have some obligations this week I can't get around, but happy to circle back to this next week!