renderToStaticNodeStream
renderToStaticNodeStream
me-render sebuah pohon (tree) React yang tidak interaktif ke dalam sebuah Node.js Readable Stream.
const stream = renderToStaticNodeStream(reactNode)
Referensi
renderToStaticNodeStream(reactNode)
Pada server, panggil renderToStaticNodeStream
untuk mendapatkan sebuah Node.js Readable Stream.
import { renderToStaticNodeStream } from 'react-dom/server';
const stream = renderToStaticNodeStream(<Page />);
stream.pipe(response);
Lihat lebih banyak contoh di bawah ini.
Stream akan menghasilkan keluaran HTML yang tidak interaktif dari komponen-komponen React anda.
Parameter
reactNode
: Sebuah node React yang ingin anda render ke dalam HTML. Misalnya, sebuah elemen JSX seperti<Page />
.
Returns
Sebuah Node.js Readable Stream yang menghasilkan sebuah string HTML. HTML yang dihasilkan tidak bisa dihidrasi (hydrated) di sisi klien.
Caveats
-
Keluaran
renderToStaticNodeStream
tidak dapat dihidrasi (hydrated). -
Method ini akan menunggu semua Suspense boundaries untuk diselesaikan sebelum mengembalikan keluaran apapun.
-
Sejak React 18, metode ini menyangga semua keluarannya, sehingga tidak memberikan keuntungan stream apapun .
-
Stream yang dikembalikan merupakan sebuah byte stream yang encoded dalam utf-8. Jika anda membutuhkan sebuah stream lain yang di-encode, lihatlah ke sebuah proyek seperti iconv-lite, yang memberikan transformasi stream untuk transcoding teks.
Penggunaan
Me-render sebuah pohon React sebagai HTML statis ke dalam sebuah Node.js Readable Stream
Panggil renderToStaticNodeStream
untuk mendapatkan sebuah Node.js Readable Stream yang dapat dihubungkan ke respon server:
import { renderToStaticNodeStream } from 'react-dom/server';
// Sintaks route bergantung pada framework backend yang digunakan
app.use('/', (request, response) => {
const stream = renderToStaticNodeStream(<Page />);
stream.pipe(response);
});
Stream akan menghasilkan keluaran awal HTML yang tidak interaktif dari komponen-komponen React anda.