Javascript 同时过多的字符串浓缩会使前端长时间阻塞，如何优化？

我使用websocket来监听来自服务器的消息并在前端显示它。但有时短时间内收到的信息太多，导致浏览器长时间处于阻塞状态。这是我的密码：

这是用于接收消息的websocket事件

        $scope.logSocket.on('connect',function(){
        console.log("Log socket connected and ready to get log.");
        $scope.logSocket.on('log',function(data){
            checkStartPhase(data, app);
            appendLogText(data);
        });

下面的代码将数据刷新到前端（使用angular js）：

我必须使用函数checkAppPhase（）检查日志的状态

---

任何优化它的建议都是非常好的

您可以做的是删除旧条目：

var appendLogText = function(log) {    
    var t = $('#startConsoleContent');
    while(t.children().length>=10)
        t.find(':first').remove();
    t.append('<div>'+log+'</div>');
    t.scrollTop(t[0].scrollHeight - t.height());
}

var appendLogText=函数（log）{
var t=$（'startConsollecontent'）；
而（t.children（）.长度>=10）
t、 查找（“：first”）.remove（）；
t、 追加（“”+log+“”）；
t、 scrollTop（t[0].scrollHeight-t.height（））；
}

此版本的方法只允许日志上有10个条目

演示：

---

现在将其修改为您想要的条目数。

我马上看到两件事。1） 您可以获得对

$（“#StartConsollecontent”）的引用

提前而不是每次调用函数，2）使用

==

而不是。indexOf可能在某种程度上更快，但我无法证明这一点。第一个建议很有用，我会尝试一下。对于第二个，我使用.indexOf查找

regExp

是否是

data

字符串的子字符串，

=

可能不起作用。在我看来，这些字符串是提前知道的，因此似乎没有理由使用indexOf，但如果字符串是随机带前缀的，或者什么的，那么我知道你为什么要使用它了。我尝试过了，问题解决了，非常感谢：）

    var checkStartPhase = function(data, app) {
    var regExp1 = 'Downloaded app package';
    var regExp2 = 'Uploading droplet';
    var regExp3 = 'Staging failed';
    var regExp4 = 'BUILD FAILURE';
    var regExp5 = 'Starting app instance';
    if(  data.indexOf(regExp1) > -1) {
        $scope.app_step =2;
    } else if(data.indexOf(regExp2) > -1 || data.indexOf(regExp5) > -1) {
            $scope.app_step =3;
    } else if(data.indexOf(regExp3) > -1 || data.indexOf(regExp4) > -1) {
        $scope.stage_failed = true;
        $scope.app_step =2;
    }

}

var appendLogText = function(log) {    
    var t = $('#startConsoleContent');
    while(t.children().length>=10)
        t.find(':first').remove();
    t.append('<div>'+log+'</div>');
    t.scrollTop(t[0].scrollHeight - t.height());
}