javascript工作时阻止Web界面

我有一个问题，我正在使用websocket更新实时数据，问题是当数据更新时，所有web界面都被阻止，我不能使用按钮滚动条、文本框等。可能是DOM操作异步工作，或者其他解决方案，我正在使用angularjs、jquery和html5，请检查此url

更新：代码

websocketis参考

ws = new window[support]('ws://xx.xxx.xxx.xx:port/');

                    // when data is comming from the server, this method is called
ws.onmessage = function (evt) {
    // Here I proccess the message
    // I walk the whole message, looking at the object id
    for(.....){
       if(...){//i find the id, them i change the data
          //each materials for stundet finded
           for($x=0;$x<=evt.data[0].student[0].materials.length.....
                    $scope.data[0].Event[$idfind].BetType[$x]=evt.data[0].Event[0].BetType[$x]
          }
        }

    }
    .....
    ....
}

接下来，我将以如下方式显示具有角度的数据：

<div ng-repeat="Event in data[0].Event">
   Home:{{Event.Home}}
   vs
   Home:{{Event.Away}}
   ....
   ....
   <div ng-repeat="Bet in Event .bettype">
     Away {{bet.Away}}
    home {{bet.home }}
    ...
    ....
   ....
   </div>

</div

---

这只是一个例子，因为70左右的每个事件大约有20行bettype，每行bettype5-10行，每条消息大约有0.3-1.2秒。

我怀疑您发送的数据太多太频繁。在我看来，每秒有10-20k的webSocket消息被发送到客户端超过一次，因此您的客户端将所有时间都花在处理这些信息和更新DOM上。一种可能性是，您的服务器只发送已更改的数据，如果数据仍然过多，则不要发送通常只每隔10秒而不是每秒发送更新的数据。此外，我没有研究DOM操作函数，但是您只想在实际发生更改时触摸DOM。服务器只发送更改数据，每条消息只发送一个事件发送的数据太多，客户端将所有时间都用于处理此数据流。您将需要发送更少的数据，或者找到一种使数据处理效率更高的方法。我有一台功能相对强大的笔记本电脑，我的笔记本电脑几乎无法跟上处理速度，但大部分时间都很忙。这是太多的处理。仅供参考，如果您不经常发送这么多数据，我认为您的服务器也可能具有更高的可扩展性。问题是，更新页面的数据（我不操纵）是一项独立的服务，并且所有数据都是实时的，如果我听不到数据，可能会对您造成伤害。我告诉您事实。您正在向客户端发送大量数据，每秒发送一次以上，而客户端正忙于处理数据，因此它通常无法跟上，因此UI没有响应。您必须发送更少的数据，或者使数据处理更加高效。仅供参考，如果在移动设备上观看，它会耗尽电池电量，并占用相当多的带宽，如每分钟600-800kb。您可以使用Chrome的评测来查看所有CPU时间都花在了哪里。