Next.js ਵਿੱਚ Suspense ਦے ਨਾਲ streaming SSR ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ?

Question

Accepted Answer

**Streaming SSR** ਸਰਵਰ ਨੂੰ ਬ੍ਰਾਊਜ਼ਰ ਨੂੰ HTML **ਚੰਕਸ ਵਿੱਚ ਭੇਜਣ ਦਿੰਦਾ ਹੈ ਜਿਵੇਂ ਇਹ ਤਿਆਰ ਹੋ**, ਪੂਰੇ ਪੇਜ ਦੇ ਰੈਂਡਰ ਹੋਣ ਦਾ ਇੰਤਜ਼ਾਰ ਕੀਤੇ ਬਿਨਾਂ। ਸੁਸਤ ਭਾਗ ਤੇਜ਼ ਭਾਗਾਂ ਨੂੰ ਬਲਾਕ ਨਹੀਂ ਕਰਦੇ — ਯੂਜ਼ਰ ਸਮੱਗਰੀ ਨੂੰ ਕ੍ਰਮਵਾਰ ਦੇਖਦਾ ਹੈ। React `` ਸਟ੍ਰੀਮਿੰਗ ਸੀਮਾਵਾਂ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦਾ ਹੈ। ## ਸਮੱਸਿਆ ਜੋ streaming ਹੱਲ ਕਰਦੀ ਹੈ Streaming ਤੋਂ ਬਿਨਾਂ, ਜੇਕਰ ਇੱਕ ਭਾਗ ਨੂੰ ਸੁਸਤੀ ਡਾਟਾਬੇਸ ਖੋਜ ਦੀ ਲੋੜ ਹੈ, **ਪੂਰਾ ਪੇਜ** ਕਿਸੇ ਵੀ HTML ਦੇ ਭੇਜੇ ਜਾਣ ਤੋਂ ਪਹਿਲਾਂ ਇਸ ਦਾ ਇੰਤਜ਼ਾਰ ਕਰਦਾ ਹੈ — ਯੂਜ਼ਰ ਖਾਲੀ ਸਕ੍ਰੀਨ ਦੀ ਓਹ! ਕਰਦਾ ਹੈ। Streaming ਸ਼ੈਲ ਅਤੇ ਤੇਜ਼ ਸਮੱਗਰੀ ਤੁਰੰਤ ਭੇਜਦਾ ਹੈ, ਫਿਰ ਸੁਸਤ ਭਾਗਾਂ ਨੂੰ ਸਟ੍ਰੀਮ ਕਰਦਾ ਹੈ ਜਿਵੇਂ ਉਹ ਪੂਰਾ ਹੁੰਦਾ ਹੈ। ## Suspense ਨੂੰ ਸਟ੍ਰੀਮ ਕਰਨ ਲਈ ਵਰਤਣਾ ```tsx import { Suspense } from "react"; export default function Page() { return ( <>

{/* sent immediately */} }> {/* streams independently */} {/* an async Server Component */}

Next.js ਵਿੱਚ Suspense ਦے ਨਾਲ streaming SSR ਕਿਵੇਂ ਕੰਮ ਕਰਦਾ ਹੈ?

ਸਮੱਸਿਆ ਜੋ streaming ਹੱਲ ਕਰਦੀ ਹੈ

Suspense ਨੂੰ ਸਟ੍ਰੀਮ ਕਰਨ ਲਈ ਵਰਤਣਾ

loading.tsx ਸਵੈ-ਪ੍ਰਾਣੀ Suspense ਹੈ

ਸਟ੍ਰੀਮਿੰਗ ਮਹੱਤਵਪੂਰਨ ਮੈਟ੍ਰਿਕਸ ਕਿਉਂ ਮਦਦ ਕਰਦੀ ਹੈ

ਇਹ ਕਿਉਂ ਮਹੱਤਵਪੂਰਨ ਹੈ