Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Upgrade to React 16 #418

Closed
26 of 27 tasks
japgolly opened this issue Oct 11, 2017 · 18 comments
Closed
26 of 27 tasks

Upgrade to React 16 #418

japgolly opened this issue Oct 11, 2017 · 18 comments
Assignees
@japgolly
Labels
must
Milestone
1.2

Comments

@japgolly
Copy link
Owner

japgolly commented Oct 11, 2017 •
edited
Loading

This is going to be non-trivial. Hopefully not a big deal either.

For those salivating and pining in anticipating for this, I hope to get it done this month but no promises (I have a family to support).

Also it will come out in v1.2.0. Before then there'll be a minor release still on React 15.

Edit: Not committing to a timeline but these are the changes:

Changes & Progress

  • New render return types
    • arrays
    • strings
    • numbers
    • portals
    • null (how does sjr handle this? should we bother supporting it anyway?) -- don't support; THIS. IS. SCAALAAA!
    • EmptyVdom (Scala version of above)
    • boolean (to support JS syntax bool && expr - should we support this? it's ≈ null, even when true) -- don't support; THIS. IS. SCAALAAA!
    • Option[_] (Scala version of above)
    • fragments
  • Fragments
  • Portals
  • "Error boundaries"
    • componentDidCatch
  • React Addons have been discontinued
    • react-addons-test-utils is now react-dom/test-utils
    • perf doesn't work with 16 - no replacement yet
    • react-addons-css-transition-group is now react-transition-group, a separate lib
  • Deprecated now removed
    • createClass
  • VDOM
  • Other
    • New rules for Keys
    • New rules for Refs
    • getDOMNode should now return Element | Text instead of just Element
    • Refresh vdom builder prod-mode logic
    • Refresh component builder logic
    • componentDidUpdate lifecycle no longer receives prevContext param. See Pass prevContext param to componentDidUpdate facebook/react#8631 (Don't think sjr is affected)
    • Remember to test module paths with sjs-bundler -- wasted enough time trying to get fragile bundler to even run my tests
    • Depends on requestAnimationFrame (even in test environments). Might need shim: import 'raf/polyfill'

Externalised
@japgolly japgolly added the must label Oct 11, 2017
@japgolly japgolly self-assigned this Oct 11, 2017
@japgolly
Copy link
Owner Author

https://twitter.com/japgolly/status/933118294705422336

Would anyone be interested in sponsoring me to update #scalajs-#react to React 16?

Context: I've never been paid any of my time on OSS; all of my OSS work I've done at the cost of other paying work. React16 is non-trivial and I doubt I'll be able to do it for free for a while.

I envision 3 outcomes here.

  1. I get sponsored and add React 16 support.
  2. Community member(s) contribute React 16 support (understanding that the review process might be a little slow).
  3. We all wait until next year and likely Q2/Q3 at that.

@japgolly
Copy link
Owner Author

And to those of you reading this because you've subscribed because you love the project, you're probably disappointed and I'm sorry for that. It will definitely happen, externally, it's just a matter of when.

@bjenkinsgit
Copy link

bjenkinsgit commented Nov 22, 2017 via email

@ngbinh
Copy link

ngbinh commented Nov 22, 2017

as mentioned in Twitter, I would love to contribute to making this happen. Thanks for the awesome work!

@erinmez
Copy link

erinmez commented Nov 28, 2017

@japgolly I would like to donate too. Is this set up somewhere already?

@japgolly
Copy link
Owner Author

japgolly commented Dec 2, 2017

Hi all. I've setup a patreon page. If you would like to contribute and are able, I'd really appreciate your support. If you know any one else that enjoys this project, my other OSS libraries, or even my programming blog enough to support me and could reach out to them, that would be tremendously helpful too. Thank you! 🙇‍♂️

@nafg
Copy link

nafg commented Dec 3, 2017

BTW I'm using the existing version on 16, so I guess this is about adding new features like essentially returning VdomArray instead of VdomElement? Or am I missing a lot?

@japgolly
Copy link
Owner Author

@nafg yes, exactly. I need to go through all the React 16.x changelogs and find anything and everything that requires a change here. So adding new features like the portal stuff, adding new VDOM, updating the type-system for new logic/rules (like returning VdomArray from render), etc.

But because React 16 is backwards-compatible with React 15, so too will scalajs-react work with React 16 in a React 15 way.

@nafg
Copy link

nafg commented Dec 17, 2017

Thanks for the explanation :)

@japgolly japgolly mentioned this issue Dec 28, 2017
Closed
@japgolly
Copy link
Owner Author

japgolly commented Dec 28, 2017 via email

@japgolly
Copy link
Owner Author

japgolly commented Dec 28, 2017 •
edited
Loading

Ok these are the changes required for full React 16 support:

  • New render return types
    • arrays
    • strings
    • numbers
    • portals
    • null (how does sjr handle this? should we bother supporting it anyway?)
    • EmptyVdom (Scala version of above)
    • boolean (to support JS syntax bool && expr - should we support this? it's ≈ null, even when true)
    • Option[_] (Scala version of above)
    • fragments
  • Fragments
  • Portals
  • "Error boundaries"
    • componentDidCatch
  • React Addons have been discontinued
    • react-addons-test-utils is now react-dom/test-utils
    • perf doesn't work with 16 - no replacement yet
    • react-addons-css-transition-group is now react-transition-group, a separate lib
  • Deprecated now removed
    • createClass
  • VDOM
    • Allow on as a custom attribute for AMP. #11153
  • Other
    • Calling setState with null no longer triggers an update.
      • Support S => Option[S]-like patterns, setState filters
    • componentDidUpdate lifecycle no longer receives prevContext param. See #8631 (Don't think sjr is affected)
    • Remember to test module paths with sjs-bundler
    • Depends on requestAnimationFrame (even in test environments). Might need shim: import 'raf/polyfill'
    • ReactDOMServer.renderToNodeStream() and ReactDOMServer.renderToStaticNodeStream()

@japgolly japgolly added this to the 1.2 milestone Dec 28, 2017
@japgolly japgolly mentioned this issue Feb 11, 2018
Merged
@japgolly japgolly mentioned this issue Mar 2, 2018
Closed
@japgolly
Copy link
Owner Author

japgolly commented Mar 2, 2018

Two tasks externalised (#448 #449) but otherwise: done! 🎉

@japgolly japgolly closed this as completed Mar 2, 2018
@cquiroz
Copy link
Collaborator

cquiroz commented Mar 2, 2018

Wow! Thanks 👍 looking forward to use it

@ngbinh
Copy link

ngbinh commented Mar 3, 2018

this is awesome!

@japgolly
Copy link
Owner Author

japgolly commented Mar 3, 2018

Cheers! Not long to go

@nafg
Copy link

nafg commented Mar 4, 2018

Very exciting!

Not to make life more difficult, but note https://medium.com/@baphemot/whats-new-in-react-16-3-d2c9b7b6193b -- in particular,

The functions that will be in time considered deprecation are:
[...]
componentWillReceiveProps — a new function, static getDerivedStateFromProps is introduced

@japgolly
Copy link
Owner Author

japgolly commented Mar 4, 2018

Thanks @nafg. A lifecycle method will only be a 15min change so I'm not too worried about that. I think I'll get 1.2.0 out supporting React 16.2 ASAP, then follow up with a compatible 1.2.1 for React 16.3 when it's released.

@nafg
Copy link

nafg commented Mar 4, 2018 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@japgolly japgolly

Labels
must
Projects
None yet
Milestone
1.2
Development

No branches or pull requests
6 participants
@nafg @japgolly @ngbinh @cquiroz @bjenkinsgit @erinmez