diff --git a/package.json b/package.json
index 7811865fb..3dd3550f1 100644
--- a/package.json
+++ b/package.json
@@ -24,10 +24,7 @@
     "smoke": "node tests/smoke/run"
   },
   "lint-staged": {
-    "*.js": [
-      "prettier --write \"**/*.{js,json}\"",
-      "git add"
-    ]
+    "*.js": ["prettier --write \"**/*.{js,json}\"", "git add"]
   },
   "author": {
     "name": "Algolia, Inc.",
@@ -72,7 +69,6 @@
     "react-test-renderer": "16.14.0",
     "rollup": "1.32.1",
     "rollup-plugin-babel": "4.4.0",
-    "rollup-plugin-commonjs": "10.1.0",
     "rollup-plugin-node-builtins": "2.1.2",
     "rollup-plugin-node-globals": "1.4.0",
     "rollup-plugin-node-resolve": "5.2.0",
@@ -84,11 +80,10 @@
   },
   "dependencies": {
     "@base2/pretty-print-object": "1.0.0",
-    "is-plain-object": "3.0.1"
+    "is-plain-object": "3.0.1",
+    "react-is": "^17.0.2"
   },
   "jest": {
-    "setupFilesAfterEnv": [
-      "<rootDir>tests/setupTests.js"
-    ]
+    "setupFilesAfterEnv": ["<rootDir>tests/setupTests.js"]
   }
 }
diff --git a/rollup.config.js b/rollup.config.js
index d582d022c..aa07cb4a6 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -1,12 +1,13 @@
 import babel from 'rollup-plugin-babel';
-import commonjs from 'rollup-plugin-commonjs';
 import resolve from 'rollup-plugin-node-resolve';
 import builtins from 'rollup-plugin-node-builtins';
 import globals from 'rollup-plugin-node-globals';
 import pkg from './package.json';
 
-const extractPackagePeerDependencies = () =>
-  Object.keys(pkg.peerDependencies) || [];
+const extractExternals = () => [
+  ...Object.keys(pkg.dependencies || {}),
+  ...Object.keys(pkg.peerDependencies || {}),
+];
 
 export default {
   input: 'src/index.js',
@@ -22,7 +23,7 @@ export default {
       sourcemap: true,
     },
   ],
-  external: extractPackagePeerDependencies(),
+  external: extractExternals(),
   plugins: [
     babel({
       babelrc: false,
@@ -36,12 +37,6 @@ export default {
     resolve({
       mainFields: ['module', 'main', 'jsnext', 'browser'],
     }),
-    commonjs({
-      sourceMap: true,
-      namedExports: {
-        react: ['isValidElement'],
-      },
-    }),
     globals(),
     builtins(),
   ],
diff --git a/src/index.spec.js b/src/index.spec.js
index c2b4c288c..790d3177d 100644
--- a/src/index.spec.js
+++ b/src/index.spec.js
@@ -1160,4 +1160,174 @@ describe('reactElementToJSXString(ReactElement)', () => {
     }
     mount(<App />);
   });
+
+  it('should use inferred function name as display name for `forwardRef` element', () => {
+    const Tag = React.forwardRef(function Tag({ text }, ref) {
+      return <span ref={ref}>{text}</span>;
+    });
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<Tag text="some label" />`
+    );
+  });
+
+  it('should use `displayName` instead of inferred function name as display name for `forwardRef` element', () => {
+    const Tag = React.forwardRef(function Tag({ text }, ref) {
+      return <span ref={ref}>{text}</span>;
+    });
+    Tag.displayName = 'MyTag';
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<MyTag text="some label" />`
+    );
+  });
+
+  it('should use inferred function name as display name for `memo` element', () => {
+    const Tag = React.memo(function Tag({ text }) {
+      return <span>{text}</span>;
+    });
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<Tag text="some label" />`
+    );
+  });
+
+  it('should use `displayName` instead of inferred function name as display name for `memo` element', () => {
+    const Tag = React.memo(function Tag({ text }) {
+      return <span>{text}</span>;
+    });
+    Tag.displayName = 'MyTag';
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<MyTag text="some label" />`
+    );
+  });
+
+  it('should use inferred function name as display name for a `forwardRef` wrapped in `memo`', () => {
+    const Tag = React.memo(
+      React.forwardRef(function Tag({ text }, ref) {
+        return <span ref={ref}>{text}</span>;
+      })
+    );
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<Tag text="some label" />`
+    );
+  });
+
+  it('should use inferred function name as display name for a component wrapped in `memo` multiple times', () => {
+    const Tag = React.memo(
+      React.memo(
+        React.memo(function Tag({ text }) {
+          return <span>{text}</span>;
+        })
+      )
+    );
+    expect(reactElementToJSXString(<Tag text="some label" />)).toEqual(
+      `<Tag text="some label" />`
+    );
+  });
+
+  it('should stringify `StrictMode` correctly', () => {
+    const App = () => null;
+
+    expect(
+      reactElementToJSXString(
+        <React.StrictMode>
+          <App />
+        </React.StrictMode>
+      )
+    ).toEqual(`<StrictMode>
+  <App />
+</StrictMode>`);
+  });
+
+  it('should stringify `Suspense` correctly', () => {
+    const Spinner = () => null;
+    const ProfilePage = () => null;
+
+    expect(
+      reactElementToJSXString(
+        <React.Suspense fallback={<Spinner />}>
+          <ProfilePage />
+        </React.Suspense>
+      )
+    ).toEqual(`<Suspense fallback={<Spinner />}>
+  <ProfilePage />
+</Suspense>`);
+  });
+
+  it('should stringify `Profiler` correctly', () => {
+    const Navigation = () => null;
+
+    expect(
+      reactElementToJSXString(
+        <React.Profiler id="Navigation" onRender={() => {}}>
+          <Navigation />
+        </React.Profiler>
+      )
+    ).toEqual(`<Profiler
+  id="Navigation"
+  onRender={function noRefCheck() {}}
+>
+  <Navigation />
+</Profiler>`);
+  });
+
+  it('should stringify `Contex.Provider` correctly', () => {
+    const Ctx = React.createContext();
+    const App = () => {};
+
+    expect(
+      reactElementToJSXString(
+        <Ctx.Provider value={null}>
+          <App />
+        </Ctx.Provider>
+      )
+    ).toEqual(`<Context.Provider value={null}>
+  <App />
+</Context.Provider>`);
+  });
+
+  it('should stringify `Contex.Provider` with `displayName` correctly', () => {
+    const Ctx = React.createContext();
+    Ctx.displayName = 'MyCtx';
+
+    const App = () => {};
+
+    expect(
+      reactElementToJSXString(
+        <Ctx.Provider value={null}>
+          <App />
+        </Ctx.Provider>
+      )
+    ).toEqual(`<MyCtx.Provider value={null}>
+  <App />
+</MyCtx.Provider>`);
+  });
+
+  it('should stringify `Contex.Consumer` correctly', () => {
+    const Ctx = React.createContext();
+    const Button = () => null;
+
+    expect(
+      reactElementToJSXString(
+        <Ctx.Consumer>{theme => <Button theme={theme} />}</Ctx.Consumer>
+      )
+    ).toEqual(`<Context.Consumer />`);
+  });
+
+  it('should stringify `Contex.Consumer` with `displayName` correctly', () => {
+    const Ctx = React.createContext();
+    Ctx.displayName = 'MyCtx';
+
+    const Button = () => null;
+
+    expect(
+      reactElementToJSXString(
+        <Ctx.Consumer>{theme => <Button theme={theme} />}</Ctx.Consumer>
+      )
+    ).toEqual(`<MyCtx.Consumer />`);
+  });
+
+  it('should stringify `lazy` component correctly', () => {
+    const Lazy = React.lazy(() => Promise.resolve(() => {}));
+
+    expect(reactElementToJSXString(<Lazy />)).toEqual(`<Lazy />`);
+  });
 });
diff --git a/src/parser/parseReactElement.js b/src/parser/parseReactElement.js
index 773b1a98d..589a59169 100644
--- a/src/parser/parseReactElement.js
+++ b/src/parser/parseReactElement.js
@@ -1,6 +1,18 @@
 /* @flow */
 
 import React, { type Element as ReactElement, Fragment } from 'react';
+import {
+  ForwardRef,
+  isContextConsumer,
+  isContextProvider,
+  isForwardRef,
+  isLazy,
+  isMemo,
+  isProfiler,
+  isStrictMode,
+  isSuspense,
+  Memo,
+} from 'react-is';
 import type { Options } from './../options';
 import {
   createStringTreeNode,
@@ -12,12 +24,56 @@ import type { TreeNode } from './../tree';
 
 const supportFragment = Boolean(Fragment);
 
-const getReactElementDisplayName = (element: ReactElement<*>): string =>
-  element.type.displayName ||
-  (element.type.name !== '_default' ? element.type.name : null) || // function name
-  (typeof element.type === 'function' // function without a name, you should provide one
-    ? 'No Display Name'
-    : element.type);
+const getFunctionTypeName = (functionType): string => {
+  if (!functionType.name || functionType.name === '_default') {
+    return 'No Display Name';
+  }
+  return functionType.name;
+};
+
+const getWrappedComponentDisplayName = (Component: *): string => {
+  switch (true) {
+    case Boolean(Component.displayName):
+      return Component.displayName;
+    case Component.$$typeof === Memo:
+      return getWrappedComponentDisplayName(Component.type);
+    case Component.$$typeof === ForwardRef:
+      return getWrappedComponentDisplayName(Component.render);
+    default:
+      return getFunctionTypeName(Component);
+  }
+};
+
+// heavily inspired by:
+// https://github.com/facebook/react/blob/3746eaf985dd92f8aa5f5658941d07b6b855e9d9/packages/react-devtools-shared/src/backend/renderer.js#L399-L496
+const getReactElementDisplayName = (element: ReactElement<*>): string => {
+  switch (true) {
+    case typeof element.type === 'string':
+      return element.type;
+    case typeof element.type === 'function':
+      if (element.type.displayName) {
+        return element.type.displayName;
+      }
+      return getFunctionTypeName(element.type);
+    case isForwardRef(element):
+    case isMemo(element):
+      return getWrappedComponentDisplayName(element.type);
+    case isContextConsumer(element):
+      return `${element.type._context.displayName || 'Context'}.Consumer`;
+    case isContextProvider(element):
+      return `${element.type._context.displayName || 'Context'}.Provider`;
+    case isLazy(element):
+      return 'Lazy';
+    case isProfiler(element):
+      return 'Profiler';
+    case isStrictMode(element):
+      return 'StrictMode';
+    case isSuspense(element):
+      return 'Suspense';
+    default:
+      return 'UnknownElementType';
+  }
+};
 
 const noChildren = (propsValue, propName) => propName !== 'children';
 
diff --git a/yarn.lock b/yarn.lock
index e46174b99..2a1060dfd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5605,13 +5605,6 @@ is-redirect@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-redirect/-/is-redirect-1.0.0.tgz#1d03dded53bd8db0f30c26e4f95d36fc7c87dc24"
 
-is-reference@^1.1.2:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/is-reference/-/is-reference-1.1.3.tgz#e99059204b66fdbe09305cfca715a29caa5c8a51"
-  integrity sha512-W1iHHv/oyBb2pPxkBxtaewxa1BC58Pn5J0hogyCdefwUIvb6R+TGbAcIa4qPNYLqLhb3EnOgUf2MQkkF76BcKw==
-  dependencies:
-    "@types/estree" "0.0.39"
-
 is-regex@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.4.tgz#5517489b547091b0930e095654ced25ee97e9491"
@@ -6683,12 +6676,6 @@ magic-string@^0.22.5:
   dependencies:
     vlq "^0.2.2"
 
-magic-string@^0.25.2:
-  version "0.25.2"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.2.tgz#139c3a729515ec55e96e69e82a11fe890a293ad9"
-  dependencies:
-    sourcemap-codec "^1.4.4"
-
 make-dir@^1.0.0, make-dir@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.3.0.tgz#79c1033b80515bd6d24ec9933e860ca75ee27f0c"
@@ -8020,6 +8007,11 @@ react-is@^16.8.6:
   version "16.8.6"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16"
 
+react-is@^17.0.2:
+  version "17.0.2"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
+  integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
+
 react-test-renderer@16.14.0:
   version "16.14.0"
   resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.14.0.tgz#e98360087348e260c56d4fe2315e970480c228ae"
@@ -8527,12 +8519,6 @@ resolve@^1.10.0, resolve@^1.3.2:
   dependencies:
     path-parse "^1.0.6"
 
-resolve@^1.11.0:
-  version "1.11.0"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.11.0.tgz#4014870ba296176b86343d50b60f3b50609ce232"
-  dependencies:
-    path-parse "^1.0.6"
-
 resolve@^1.11.1, resolve@^1.12.0:
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.12.0.tgz#3fc644a35c84a48554609ff26ec52b66fa577df6"
@@ -8586,17 +8572,6 @@ rollup-plugin-babel@4.4.0:
     "@babel/helper-module-imports" "^7.0.0"
     rollup-pluginutils "^2.8.1"
 
-rollup-plugin-commonjs@10.1.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/rollup-plugin-commonjs/-/rollup-plugin-commonjs-10.1.0.tgz#417af3b54503878e084d127adf4d1caf8beb86fb"
-  integrity sha512-jlXbjZSQg8EIeAAvepNwhJj++qJWNJw1Cl0YnOqKtP5Djx+fFGkp3WRh+W0ASCaFG5w1jhmzDxgu3SJuVxPF4Q==
-  dependencies:
-    estree-walker "^0.6.1"
-    is-reference "^1.1.2"
-    magic-string "^0.25.2"
-    resolve "^1.11.0"
-    rollup-pluginutils "^2.8.1"
-
 rollup-plugin-node-builtins@2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/rollup-plugin-node-builtins/-/rollup-plugin-node-builtins-2.1.2.tgz#24a1fed4a43257b6b64371d8abc6ce1ab14597e9"
@@ -9002,10 +8977,6 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
 
-sourcemap-codec@^1.4.4:
-  version "1.4.4"
-  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.4.tgz#c63ea927c029dd6bd9a2b7fa03b3fec02ad56e9f"
-
 spdx-correct@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40"