From 0248afa01e003a55b290123ce8494bed9575656d Mon Sep 17 00:00:00 2001 From: Nafis Tiham Date: Wed, 21 Jun 2023 22:44:19 +0600 Subject: [PATCH 1/3] render-to-node-stream-wip-70% --- .../react-dom/server/renderToNodeStream.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/content/reference/react-dom/server/renderToNodeStream.md b/src/content/reference/react-dom/server/renderToNodeStream.md index a4ab2e570..fc4a2897e 100644 --- a/src/content/reference/react-dom/server/renderToNodeStream.md +++ b/src/content/reference/react-dom/server/renderToNodeStream.md @@ -4,13 +4,13 @@ title: renderToNodeStream -This API will be removed in a future major version of React. Use [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) instead. +এই API ভবিষ্যতে React এর বড় কোন আপডেতে ফেলে দেওয়া হবে। এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করুন। -`renderToNodeStream` renders a React tree to a [Node.js Readable Stream.](https://nodejs.org/api/stream.html#readable-streams) +`renderToNodeStream` একটি React ট্রিকে একটি [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) এ রেন্ডার করে। ```js const stream = renderToNodeStream(reactNode) @@ -22,11 +22,11 @@ const stream = renderToNodeStream(reactNode) --- -## Reference {/*reference*/} +## রেফারেন্স {/*reference*/} ### `renderToNodeStream(reactNode)` {/*rendertonodestream*/} -On the server, call `renderToNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) which you can pipe into the response. +সার্ভারে, [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) পাবার জন্য `renderToNodeStream` কল করুন, যেটা আপনি রেসপন্সের মধ্যে pipe করে দিতে পারবেন। ```js import { renderToNodeStream } from 'react-dom/server'; @@ -35,7 +35,7 @@ const stream = renderToNodeStream(); stream.pipe(response); ``` -On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to make the server-generated HTML interactive. +ক্লায়েন্টে, সার্ভার থেকে তৈরী HTML ইন্টার‍্যাক্টিভ করতে [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) কল করুন। [See more examples below.](#usage) @@ -47,11 +47,11 @@ On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) that outputs an HTML string. -#### Caveats {/*caveats*/} +#### সতর্কতা {/*caveats*/} -* This method will wait for all [Suspense boundaries](/reference/react/Suspense) to complete before returning any output. +* এই মেথডটি কোন আউটপুট রিটার্ন করবার আগে সকল [Suspense boundary](/reference/react/Suspense) এর সম্পূর্ণ হবার জন্য অপেক্ষা করে। -* As of React 18, this method buffers all of its output, so it doesn't actually provide any streaming benefits. This is why it's recommended that you migrate to [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) instead. +* React 18 নাগাদ, এই মেথডটি এর সকল আউটপুট বাফার করে, তার এটা আসলে streaming এর সুবিধা দিতে পারে না। এ কারণেই, এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করার জন্য আপনাকে পরামর্শ দেওয়া হচ্ছে। * The returned stream is a byte stream encoded in utf-8. If you need a stream in another encoding, take a look at a project like [iconv-lite](https://www.npmjs.com/package/iconv-lite), which provides transform streams for transcoding text. From 9bded454212978f4d91897c74db6a732c2cbcc25 Mon Sep 17 00:00:00 2001 From: Nafis Tiham Date: Thu, 22 Jun 2023 02:48:45 +0600 Subject: [PATCH 2/3] render-to-node-stream-done --- .../react-dom/server/renderToNodeStream.md | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/content/reference/react-dom/server/renderToNodeStream.md b/src/content/reference/react-dom/server/renderToNodeStream.md index fc4a2897e..96521a8da 100644 --- a/src/content/reference/react-dom/server/renderToNodeStream.md +++ b/src/content/reference/react-dom/server/renderToNodeStream.md @@ -53,24 +53,25 @@ A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) * React 18 নাগাদ, এই মেথডটি এর সকল আউটপুট বাফার করে, তার এটা আসলে streaming এর সুবিধা দিতে পারে না। এ কারণেই, এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করার জন্য আপনাকে পরামর্শ দেওয়া হচ্ছে। -* The returned stream is a byte stream encoded in utf-8. If you need a stream in another encoding, take a look at a project like [iconv-lite](https://www.npmjs.com/package/iconv-lite), which provides transform streams for transcoding text. +* রিটার্ন হওয়া stream হচ্ছে utf-8 এ এনকোড করা byte stream। আপনি যদি অন্য কোন এনকোডিং এ stream চান, তাহলে [iconv-lite](https://www.npmjs.com/package/iconv-lite) এর মত কোন প্রজেক্ট দেখতে পারে, যা টেক্সট transcoding এর জন্য transform stream দেয়। --- -## Usage {/*usage*/} +## ব্যবহার {/*usage*/} -### Rendering a React tree as HTML to a Node.js Readable Stream {/*rendering-a-react-tree-as-html-to-a-nodejs-readable-stream*/} +### একটা React ট্রিকে HTML হিসেবে একটা Node.js Readable Stream এ রেন্ডার করা {/*rendering-a-react-tree-as-html-to-a-nodejs-readable-stream*/} -Call `renderToNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) which you can pipe to your server response: + +একটি [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) পাবার জন্য `renderToNodeStream` কল করুন, যেটা আপনি সার্ভার রেসপন্সে pipe করে দিতে পারবেনঃ ```js {5-6} import { renderToNodeStream } from 'react-dom/server'; -// The route handler syntax depends on your backend framework +// Route handler syntax আপনার ব্যাকেন্ড ফ্রেমওয়ার্কের উপর নির্ভর করে app.use('/', (request, response) => { const stream = renderToNodeStream(); stream.pipe(response); }); ``` -The stream will produce the initial non-interactive HTML output of your React components. On the client, you will need to call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to *hydrate* that server-generated HTML and make it interactive. +Stream আপনার React কম্পোনেন্টগুলোর প্রাথমিক নন-ইন্টার‍্যাকটিভ HTML আউটপুট তৈরী করবে। ক্লায়েন্টে, সার্ভারে তৈরী হওয়া HTML কে *hydrate* করতে এবং একে ইন্টার‍্যাকটিভ করতে আপনাকে [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) কল করতে হবে। From 71f28a14a0a7d29096f152653a72e174e136d81f Mon Sep 17 00:00:00 2001 From: nafistiham Date: Thu, 22 Jun 2023 16:18:06 +0600 Subject: [PATCH 3/3] request-chanes-resolved --- .../react-dom/server/renderToNodeStream.md | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/src/content/reference/react-dom/server/renderToNodeStream.md b/src/content/reference/react-dom/server/renderToNodeStream.md index 96521a8da..eae3339fd 100644 --- a/src/content/reference/react-dom/server/renderToNodeStream.md +++ b/src/content/reference/react-dom/server/renderToNodeStream.md @@ -4,13 +4,13 @@ title: renderToNodeStream -এই API ভবিষ্যতে React এর বড় কোন আপডেতে ফেলে দেওয়া হবে। এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করুন। +এই API ভবিষ্যতে React এর বড় কোন আপডেটে অপসারণ করা হবে। এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করুন। -`renderToNodeStream` একটি React ট্রিকে একটি [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) এ রেন্ডার করে। +`renderToNodeStream` একটি React ট্রি কে একটি [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) এ রেন্ডার করে। ```js const stream = renderToNodeStream(reactNode) @@ -37,29 +37,29 @@ stream.pipe(response); ক্লায়েন্টে, সার্ভার থেকে তৈরী HTML ইন্টার‍্যাক্টিভ করতে [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) কল করুন। -[See more examples below.](#usage) +[নিচে আরো উদাহরণ দেখুন।](#usage) -#### Parameters {/*parameters*/} +#### প্যারামিটার {/*parameters*/} -* `reactNode`: A React node you want to render to HTML. For example, a JSX element like ``. +* `reactNode`: একটা React নোড যেটা আপনি HTML এ রেন্ডার করতে চান। উদাহরণস্বরূপ, `` এর মত একটি JSX এলিমেন্ট। -#### Returns {/*returns*/} +#### রিটার্ন {/*returns*/} -A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) that outputs an HTML string. +একটা [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) যা একটি HTML স্ট্রিং আউটপুট হিসেবে দেয়। #### সতর্কতা {/*caveats*/} -* এই মেথডটি কোন আউটপুট রিটার্ন করবার আগে সকল [Suspense boundary](/reference/react/Suspense) এর সম্পূর্ণ হবার জন্য অপেক্ষা করে। +* এই মেথডটি কোন আউটপুট রিটার্ন করবার আগে সকল [Suspense boundary](/reference/react/Suspense) এর সম্পূর্ণ হবার জন্য অপেক্ষা করবে। -* React 18 নাগাদ, এই মেথডটি এর সকল আউটপুট বাফার করে, তার এটা আসলে streaming এর সুবিধা দিতে পারে না। এ কারণেই, এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করার জন্য আপনাকে পরামর্শ দেওয়া হচ্ছে। +* React 18 নাগাদ, এই মেথডটি এর সকল আউটপুট বাফার করে, তাই এটা আসলে streaming এর সুবিধা দিতে পারে না। এ কারণেই, এর বদলে [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream) ব্যবহার করার জন্য আপনাকে পরামর্শ দেওয়া হচ্ছে। -* রিটার্ন হওয়া stream হচ্ছে utf-8 এ এনকোড করা byte stream। আপনি যদি অন্য কোন এনকোডিং এ stream চান, তাহলে [iconv-lite](https://www.npmjs.com/package/iconv-lite) এর মত কোন প্রজেক্ট দেখতে পারে, যা টেক্সট transcoding এর জন্য transform stream দেয়। +* রিটার্ন হওয়া stream হচ্ছে utf-8 এ এনকোড করা byte stream। আপনি যদি অন্য কোন এনকোডিং এ stream চান, তাহলে [iconv-lite](https://www.npmjs.com/package/iconv-lite) এর মত কোন প্রজেক্ট দেখতে পারেন, যা টেক্সট transcoding এর জন্য transform stream দেয়। --- ## ব্যবহার {/*usage*/} -### একটা React ট্রিকে HTML হিসেবে একটা Node.js Readable Stream এ রেন্ডার করা {/*rendering-a-react-tree-as-html-to-a-nodejs-readable-stream*/} +### একটা React ট্রি কে HTML হিসেবে একটা Node.js Readable Stream এ রেন্ডার করা {/*rendering-a-react-tree-as-html-to-a-nodejs-readable-stream*/} একটি [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) পাবার জন্য `renderToNodeStream` কল করুন, যেটা আপনি সার্ভার রেসপন্সে pipe করে দিতে পারবেনঃ @@ -67,7 +67,7 @@ A [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) ```js {5-6} import { renderToNodeStream } from 'react-dom/server'; -// Route handler syntax আপনার ব্যাকেন্ড ফ্রেমওয়ার্কের উপর নির্ভর করে +// Route handler syntax আপনার ব্যাকেন্ড ফ্রেমওয়ার্কের উপর নির্ভর করে app.use('/', (request, response) => { const stream = renderToNodeStream(); stream.pipe(response);