React.js / socket.io проблема узких мест

Question

Я новичок в реакции. js и начал мигрировать старое чистое приложение HTML / CSS / JS для реагирования. js, приложение состоит в получении трансляций с низкой задержкой, я Я использовал приложение create-Reaction-app для создания своего проекта, и теперь я столкнулся со странной проблемой узких мест на стороне реакции. js.

Я создал модуль в приложении для обработки широковещательных сообщений socket.io, но при запуске приложения возникает странная высокая задержка при получении широковещательных сообщений.

Это время задержки на старом js ванильном приложении

Это задержка реакции. js app

Сначала я подумал, что проблема в том, что рендеринг занимал много времени, обрабатывая мои запросы синхронно, потому что я использую перехватчики с useEffect, поэтому я просто импортировал модуль и определил событие широковещания, ничего не рендерив, но без увеличения задержки.

Затем я создал простой клиент и запускал его независимо, и задержка была хорошей:

const io = require('socket.io-client');
//import io from 'socket.io-client';

socket = io.connect('------------------')

socket.on('connect', () =>{
  console.log("i'm connected to the server")
})

socket.on('broadcast_timer', data => {
  console.log(data)
})

Это код, который в основном реагирует. js, старый ваниль и на простом клиенте создан.

Я не знаю, связано ли это с веб-пакетом или горячей перезагрузкой (я сделал сборку из приложения и запустил ее, но проблема все еще устранялась), есть ли у кого-нибудь проблемы, такие как этот handlin г розеток?

Answer 1

Что ж, пробуя все, например, используя новое приложение create-реагировать на приложения и создавая проект реагирования, вручную конфигурируя webpack и babel, я отказался от использования socket.io, это может быть ошибкой из-за несоответствия задержек реакции. js потому что у меня его нет в другом месте и я изменил сервер для использования потоковой передачи SSE (события на стороне сервера), которая работает очень хорошо, и клиенту просто нужно подписаться на таймер и никаких дополнительных зависимостей.