renderToStaticNodeStream

const stream = renderToStaticNodeStream(reactNode, options?)

• הפניה
  • renderToStaticNodeStream(reactNode, options?)
• שימוש
  • רינדור עץ React כ-HTML סטטי ל-Node.js זרם קריא

הפניה

renderToStaticNodeStream(reactNode, options?)

בשרת, קראו ל-renderToStaticNodeStream כדי לקבל Node.js זרם קריא.

import { renderToStaticNodeStream } from 'react-dom/server';

const stream = renderToStaticNodeStream(<Page />);
stream.pipe(response);

עוד דוגמאות נוספות.

ה-stream פיקציה פלט HTML לא אינטראקטיבי של קומפונטות React שלכם.

פרמטרים

• reactNode: React צומת שברצונכם לרנדר ל-HTML. לדוגמה, אלמנט JSX כמו <Page />.

• אופציונלי options: אובייקט עבור רינדור שרת.

  • אופציונלי identifierPrefix: מחרוזת קידומת ש-React משתמשת בה עבור מזהים עובדים על ידי useId. שימושי למניעת התנגשויות כשמשתמשים בכמה שורשים באותו עמוד.

מחזירה

Node.js קריא זרם שמפיק מחרוזת HTML. אי אפשר לבצע הידרציה ל-HTML שמתקבל.

אזהרות

• אי אפשר לבצע הידרציה לפלט של renderToStaticNodeStream.

• המתודה הזו תחכה שכל גבולות Suspense יסתימו לפני החזרת פלט.

• החל מ-React 18, המתודה הזו מאחסנת את כל הפל בבאפר, כך שהייתה מספקת יתרונות סטרימינג.

• ה-stream המוחזר הוא byte stream בקידוד utf-8. אם צריך להזרים בקידוד אחר, אפשר לבדוק פרויקט כמו iconv-lite, שמספק להפוך זרמים להמרת קידוד טקסט.

שימוש

רינדור עץ React כ-HTML סטטי ל-Node.js זרם קריא

קראו ל-renderToStaticNodeStream כדי לקבל Node.js זרם קריא אפשר לבצע לו pipe לתגובת השרת:

import { renderToStaticNodeStream } from 'react-dom/server';

// The route handler syntax depends on your backend framework
app.use('/', (request, response) => {
  const stream = renderToStaticNodeStream(<Page />);
  stream.pipe(response);
});

ה-stream מפרט את פלט ה-HTML הראשוני הלא אינטראקטיבי של קומפונטות React שלכם.