All posts

When to use <React.fragment /> vs <>


In a previous post I reviewed when you should use a fragment instead of a standard HTML element when building React applications. In this post I want to review when you should use the longhand <React.Fragment> instead of the shorthand version <>.

  1. Use <React.Fragment> for when you need to map over a collection of fragments.
function Listicle(props) {
  const {items} = props

  return (
      { => (
        <React.Fragment key={}>
  1. Use the shorthand <> any other time.