Rendering React Components Using WebWorkers

I saw something on the Internet about rendering React components with HTML5 WebWorkers ... even Pete Hunt, the main honch for React, talked about it.

I have intensive work with the CPU for each element of the array, followed by the React rendering of each element of the array, so I am thinking of putting each of them into WebWorker, and then sending the HTML string back to the main thread interface.

My question is: it seems that React.renderToString deprecated in favor of ReactDOMServer.renderToString ... so I ask you all and Pete Hunt - we should use ReactDOMServer on the front-end if we want to use WebWorkers to render React components or there is another recommended approach ?

(Of course, the reason is that we can only transfer rows / serialized data between threads in JS, so the idea is to convert the React component to a string and then pass it to the main UI thread as a string.)

+5
source share
1 answer

I wrote a brief implementation of React rendering in a web worker. This is not really renderToString , but more like a custom renderer. I also found that this is much faster than a regular implementation.

The demo page has 2 applications - an example showing an application with heavy CPU usage, and a simple TODO list with events.

Performance numbers are also shown here - http://blog.nparashuram.com/2016/02/using-webworkers-to-make-react-faster.html

+3
source

Source: https://habr.com/ru/post/1238451/


All Articles