Mark's Dev Links - Issue #3

This is a post in the Newsletter series.


Weekly newsletter, sent week of 2018-02-05

Hi, and welcome to issue #3 of Mark's Dev Links! This is a weekly-ish email newsletter, focused on the React and Redux ecosystem, and stuff that's caught my attention.

ANNOUNCEMENT: LIVE WORKSHOPS FROM WORKSHOP.ME! 🔗︎

I am very excited to announce that I will be teaching several live Redux workshops this year!!! Ryan Florence has just launched a new workshop-based training series called Workshop.me, and is partnering with a who's-who list of industry experts to give in-person workshops on web development topics. This includes:

  • Kent C Dodds on testing
  • Sean Larkin on Webpack
  • Evan You on Vue
  • Sarah Drasner on SVGs and animations
  • Todd Motto on Angular

And many more!

I'm still kind of confused how I actually fit into that list, but I guess if you answer enough questions, eventually you sorta know what you're talking about, or at least people assume you do :)

So, my first Redux workshop is scheduled for April 19-20, in New York City, with others TBD dates and locations for later this year.

I'll still keep answering questions online, of course, but I'm really looking forward to this chance to help people learn Redux (and React) in person!

And with that, on with the rest of the news!

React 16.3 Roundup 🔗︎

The React team continues to crank out work and push forward with the post-Fiber changes to React's core APIs. This week, React 16.3 alpha 0 was published to NPM. Brian Vaughn and Dan Abramov answered many questions about the new APIs and behavior in a large discussion thread on Reddit. Andrew Clark filed an issue with the roadmap for the 16.3 and 16.4 releases.

Reactiflux moderator Bartosz Szczecinski wrote a good summary of the changes coming in React 16.3, how they work, and how to use them.

Dan Abramov tweeted some discussion of how the new getDerivedStateFromProps API might be used, and literally as I write this, just started dropping some hints about further future changes to React's behavior.

Also, there's a very intriguing line item buried in Andrew's 16.3 issue:

** Chose not to include in 16.3, but may be in 16.4 or beyond** - New component API. We're holding off on this until we're closer to "feature complete," a phrase which here means "having implemented async rendering and bytecode compilation."

The "bytecode compilation" mention possibly relates to some of the work that Dominic Gannaway and Sebastian Markbage have been doing around the Prepack compiler. Dominic forked the JS Frameworks Benchmark repo a couple months ago, and added a commit that shows a React component's render method converted into opcodes (credit to this Reddit thread for bringing it to my attention). Clearly some very interesting experimentation going on around precompiling React.

More setState Behavior Explanation 🔗︎

Following on from last week's explanation of why setState is async, Dan Abramov wrote another long explanation on Stack Overflow on when and why setState calls are batched together.

Modern Web Podcast S05E01: Redux and MobX with Tim Dorr and Michel Weststrate 🔗︎

A recent episode of the Modern Web Podcast featured Redux co-maintainer Tim Dorr and MobX creator Michel Weststrate talking about state management in the React world, with updates on what's happening with both libraries. Some really good discussion here, including some thoughts on how React's async rendering and new context API may affect these libraries, what data should go into a state store, use of combineReducers, and more.

Redux Ecosystem 🔗︎

redux-subspace 🔗︎

Redux's single global store approach does inherently make it harder to implement encapsulation or modularity, so I've kept a close eye out on libraries that experiment with approaches for adding those capabilities back on top of Redux. redux-subspace is a library that allows breaking up an application into many "sub-stores" that can be combined together at runtime, as well as providing encapsulation for different modules or pieces of domain logic. It's particularly intended for an enterprise-type "micro-front-end" approach where you might have many different teams working on different parts of an app, but should have benefits for several other situations as well. It also comes with integrations for React-Redux, Redux-Saga, and Redux-Observable.

Redux Issues Spotlight 🔗︎

Redux Addons Catalog - client-side UI - UPDATE! 🔗︎

Last week I linked to my request for someone to build a client-side UI for my Redux addons catalog. Since then, Github users @wilbertliu and @dberget have started tackling this project in earnest. They've already got some UI mockups and initial Markdown parsing logic in place, and are discussing planned features and behavior. I'm really excited to see this moving forward, and can't wait to see this come to fruition!

Redux docs site rebuild? 🔗︎

Since the last request for help worked out so well, I'll try it again :)

The Redux docs site is currently built with Gitbook, but I'm not particularly happy with the current build process. I'd like to investigate changing to use Gatsby or another similar static site generation tool, but don't have time to really dig into this myself. I'd love to have someone look into this for us.

On a related note, the React-Redux library currently just has its API docs in a Markdown file that's linked in the repo. I'd really like to set up a separate React-Redux docs site, and drastically improve the React-Redux docs content at the same time. There's been a bit of initial discussion for what a docs revamp might include, but I'd love to get more community involvement in improving these docs.

Me, Myself, and I 🔗︎

Note: this first sentence is now slightly out of date, per the announcement up top :)

Not a lot to mention on my end this week. Still on travel for work, so I'm pretty busy with that. I spent some time on Friday playing around with React 16's new error boundaries capability, and trying to see if there was a good way to display the component and code stack traces provided by componentDidCatch. I actually managed to hack together a mangled version of the react-error-overlay package that showed the error info, but I'd like something lighter-weight. (If anyone's already seen a good pre-built component or package for this, let me know!)

As I write this on Sunday, I've got a very interesting React-related meeting coming up tomorrow, so that should be done by the time you see this. Good chance there will be some things to talk about from that down the road.

Obligatory Plug 🔗︎

My "Practical Redux" tutorial series is now an interactive course on Educative.io!. Right now, Educative is having a sale - all courses are 50% off with coupon code LEARN2018 . That includes not just my "Practical Redux" course, but many others as well. Check it out!


This is a post in the Newsletter series. Other posts in this series: