docs: update next/dynamic docs (#44067)

## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

docs/advanced-features/dynamic-import.md

@@ -13,26 +13,21 @@ description: Dynamically import JavaScript modules and React Components and spli
 
 Next.js supports lazy loading external libraries with `import()` and React components with `next/dynamic`. Deferred loading helps improve the initial loading performance by decreasing the amount of JavaScript necessary to render the page. Components or libraries are only imported and included in the JavaScript bundle when they're used.
 
-`next/dynamic` is an extension of [`React.lazy`](https://reactjs.org/docs/code-splitting.html#reactlazy). When used in combination with [`Suspense`](https://reactjs.org/docs/react-api.html#reactsuspense), components can delay hydration until the Suspense boundary is resolved.
+`next/dynamic` is a composite extension of [`React.lazy`](https://reactjs.org/docs/code-splitting.html#reactlazy) and [`Suspense`](https://reactjs.org/docs/react-api.html#reactsuspense), components can delay hydration until the Suspense boundary is resolved.
 
 ## Example
 
 By using `next/dynamic`, the header component will not be included in the page's initial JavaScript bundle. The page will render the Suspense `fallback` first, followed by the `Header` component when the `Suspense` boundary is resolved.
 
 ```jsx
 import dynamic from 'next/dynamic'
-import { Suspense } from 'react'
 
 const DynamicHeader = dynamic(() => import('../components/header'), {
-  suspense: true,
+  loading: () => 'Loading...',
 })
 
 export default function Home() {
-  return (
-    <Suspense fallback={`Loading...`}>
-      <DynamicHeader />
-    </Suspense>
-  )
+  return <DynamicHeader />
 }
 ```