Improve the user experience "the ChatGPT way" by incrementally displaying data as it is streamed in.
This utility exposes two methods:
-
stringToReadableStream
: Transform a string toReadableStream
type.Usage: Convert a string to
ReadableStream
instance.import { stringToReadableStream } from 'process-stream-char-by-char' // ... const inputStream = stringToReadableStream(inputString)
-
processStreamCharbyChar
: If given an input stream of typeReadableStream
and a callback function, the method decodes the string and calls the callback function for each decoded character. The decoded character will be passed as an argument to the callbackUsage: Progressively add data to your react state as it is streamed in.
import { processStreamCharbyChar } from 'process-stream-char-by-char' //... processStreamCharbyChar(inputStream, (char) => setState((prev) => prev + char))