React TL;DR #2 – Top React Content of August 2019


What is React TL;DR?

How do you decide which React news can be useful to you? Or how something matches your interest or bring any value?

Content tools are easy to fool and collect a lot of crap that doesn’t really help or improve your work and this is why we decided to select the most useful React news ourselves.

Our TL;DR version delivers the essence from the article and helps you decide if it’s worth reading further to you.

Again – we don’t use any engines or tools. It is all selected by ourselves, based on what we have learned and gained profit from. No b#$%it provided.

Say hello to React TL;DR – a human filter for most useful React content.

React TL;DR – useful articles from August 2019

Interface vs Type alias in TypeScript 2.7

  • You cannot use implements on a class with type alias if you use union operator within your type definition.
  • You cannot use extends on an interface with type alias if you use union operator within your type definition.
  • Declaration merging doesn’t work with type alias.

Functional Programming in JavaScript: How and Why

Functional Programming is a programming paradigm where you mostly construct and structure your code using functions.

  • Features:
  • First-class citizens functions: you can always insert functions inside a function without any restrictions present.
  • A higher-order function: a function that gets a function as an argument.
  • Function Composition: an act of composing/creating functions that allow you to further simplify and compress your functions by taking functions as an argument and return an output.


  • It doesn’t have side-effects and it’s immutable
  • It’s clean, straightforward and KISS

React v16.9.0 and the Roadmap Update

New Deprecations:

  • You will now see a warning when using any of the old names of unsafe lifecycle method
  • Using “javascript:” URLs now will log a warning
  • No support for “factory” component that returns an object with a render method

New Features:

  • act() testing utility also accepts asynchronous functions
  • Programmatic way to gather measurements called <React.Profiler> – measures how often app renders and what’s the “cost” of render is


  • A crash when calling findDOMNode() inside a <Suspense> tree has been fixed.
  • A memory leak caused by retaining deleted subtrees has been fixed too.
  • An infinite loop caused by setState in useEffect now logs an error. (This is similar to the error you see when you call setState in componentDidUpdate in a class.)

Use React.memo() wisely

Use React.memo() when:

  • You want to mimic PureComponent in function components.
  • Your component renders often
  • Your component is usually provided with the same props during re-rendering
  • Your component contains a decent amount of UI elements to reason props equally check

5 Tips to Help You Avoid React Hooks Pitfalls

  • Read React Hooks documentation and FAQ before you start.
  • Install, use, and follow the ESLint plugin.
  • Don’t think about Lifecycles, think about synchronizing side effects to state.
  • Know that React is fast by default and do some digging before applying performance optimizations pre-maturely.
  • Avoid testing implementation details.

Stay updated with the newest React TL;DR. 

Leave a Reply

View Comments (0)...

Related articles:

React TL;DR #11 – Top React Content From May 2020

React TL;DR #10 – Most Useful React Content From April 2020