React Suspense

React Suspense is a feature introduced in React 16.6 that allows the components to “wait” for something before they can render. Typically, it’s used in a component structure to delay rendering part of your application until some condition is met (for example, data from an API request is fetched).

The most common use of React Suspense is in conjunction with lazy loading. Lazy loading helps to split your code into different bundles which can then be loaded on demand or in parallel which ultimately improve the performance of your application.

Here is an example of how to use Suspense with lazy():

```jsx
import React, { Suspense } from 'react';
const OtherComponent = React.lazy(() => import('./OtherComponent'));

function MyComponent() {
return (
<div>
<Suspense fallback={<div>Loading...</div>}>
<OtherComponent />
</Suspense>
</div>
);
}
```

In this example, the `OtherComponent` will be loaded dynamically, and during the time of loading, Suspense will show a fallback UI "Loading...", instead of rendering nothing until `OtherComponent` loaded. The fallback prop accepts any React elements that you want to render while waiting for the component to load.

Suspense for Data Fetching is a new feature that lets you also use <Suspense> to declaratively "wait" for anything else, including data. This is currently in experimental stage.