违规“消息”处理程序花费了 <N> 毫秒

Question

我在 socket.io 、nodejs 、react 的帮助下创建聊天网络。当我发送消息时，控制台消息中有一些消息或警告：-[违规]“消息”处理程序花费了毫秒，而且当我一次又一次发送消息时，毫秒增加了 200％，在聊天开始时没有警告。

[违规]“消息”处理程序花费了 167 毫秒

2.05537ff6.chunk.js:2 [违规]“消息”处理程序花费了 205 毫秒

2.05537ff6.chunk.js:2 [违规]“消息”处理程序花费了 389 毫秒

2.05537ff6.chunk.js:2 [违规]“消息”处理程序花费了 496 毫秒

2.05537ff6.chunk.js:2 [违规]“消息”处理程序花费了 1162 毫秒

        import React, { useState, useEffect } from 'react';
        import queryString from 'query-string';
        import io from 'socket.io-client';
        import './Chat.css'
        import InfoBar from './../InfoBar/InfoBar'
        import Input from './../Input/Input'
        import Messages from './../Messages/Messages'
        let socket;
        const Chat = ({ location }) => {
               const [name, setName] = useState('');
               const [room, setRoom] = useState('');
               const [message,setMessage]=useState('')
               const [messages,setMessages]=useState([])
               const ENDPOINT = 'https://d-chating.herokuapp.com/';
               useEffect(() => {
                        const { name, room } = queryString.parse(location.search)
    
    var connectionOptions = {
        "force new connection": true,
        "reconnectionAttempts": "Infinity",
        "transports": ["websocket"]
    };

    socket = io.connect(ENDPOINT, connectionOptions);
    setName(name);
    setRoom(room);
    socket.emit('join', { name, room },(error)=>{
       if(error){

           alert(error);
       }
    });


   
      },
      [ENDPOINT, location.search]
      )

      useEffect(()=>{
          socket.on('message',(message)=>{
              // console.log(message)
             setMessages([...messages,message]); 
          })
      },[messages]);


        const sendMessage =(event)=>{
            event.preventDefault();
                  if(message){
                socket.emit('sendMessage',message,()=>setMessage(''));
            }
        }
              // console.log(messages)
            return (
                <div className="outerContainer">
                    <div className='container'>
                        <InfoBar room={room} />
                  <Messages messages={messages} name={name} />
                 <Input message={message} sendMessage={sendMessage} setMessage={setMessage}/>
             
              </div>
          </div>
      )
        }
        export default Chat;