Question

所以我已经坚持了很长一段时间。我在这里问了一个类似的问题：How exactly does done() work and how can I loop executions inside done()? 但我想我的问题已经发生了一些变化。

所以问题是，我正在加载很多流，并且需要一段时间才能处理它们。因此，为了弥补这一点，我想至少将已处理的流加载到我的网页上，并同时继续处理推文流。

loadTweets: function(username) {
    $.ajax({
            url: '/api/1.0/tweetsForUsername.php?username=' + username
        }).done(function (data) {

            var json = jQuery.parseJSON(data);
            var jsonTweets = json['tweets'];

            $.Mustache.load('/mustaches.php', function() {
                for (var i = 0; i < jsonTweets.length; i++) {
                    var tweet = jsonTweets[i];
                    var optional_id = '_user_tweets';
                    $('#all-user-tweets').mustache('tweets_tweet', { tweet: tweet, optional_id: optional_id });

                    configureTweetSentiment(tweet);
                    configureTweetView(tweet);
                }
            });
        });
    }};
}

这几乎就是我的代码的结构。我想问题是for循环，因为在for循环完成之前不会显示任何内容。所以我有两个问题。

如何处理我的网站上显示的推文流？
如何确保Mustache.load（）在执行此操作时仅执行一次？

Answer 1

问题是UI操作和JS操作都在同一个线程中运行。因此，要解决此问题，您应该只使用setTimeout函数，以便JS操作在所有UI操作结束时排队。您还可以传递timeinterval的参数（大约4 ms），以便具有较慢JS引擎的浏览器也可以顺利执行。

       ... 

var i = 0;
var timer = setInterval(function() {

    var tweet = jsonTweets[i++];
    var optional_id = '_user_tweets';
    $('#all-user-tweets').mustache('tweets_tweet', {
        tweet: tweet,
        optional_id: optional_id
    });
    configureTweetSentiment(tweet);
    configureTweetView(tweet);

    if(i === jsonTweets.length){
        clearInterval(timer);
    }
}, 4); //Interval between loading tweets
        ...

注意
解决方案基于以下假设 -

您正在使用configureTweetSentiment和configureTweetView方法操作dom。

理想情况下，上面提供的解决方案不是最佳解决方案。相反，你应该首先在javascript中创建所有html元素，并在最后将最终的html字符串附加到div。你会看到性能发生剧烈变化（严重！）

您不想使用Web工作者，因为旧浏览器不支持它们。如果情况并非如此，并且您没有使用configure方法操作dom，那么Web工作人员就可以进行数据密集型操作。

如何构造我的代码以返回回调？

1 个答案: