1

所以我已经坚持了很长一段时间。我在这里问了一个类似的问题：done() 究竟是如何工作的，我如何在 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 循环完成之前什么都不会显示。所以我有两个问题。

  1. 如何在处理推文时将推文流显示在我的网站上？
  2. 如何确保 Mustache.load() 在执行此操作时只执行一次？
4

1 回答 1

0

问题是 UI 操作和 JS 操作都在同一个线程中运行。所以要解决这个问题，你应该只使用一个 setTimeout 函数，以便 JS 操作在所有 UI 操作结束时排队。您还可以传递时间间隔（大约 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
        ...

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

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

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

  2. 您不想使用网络工作者，因为旧浏览器不支持它们。如果情况并非如此，并且您没有使用这些configure方法来操作 dom，那么 Web Worker 就是进行数据密集型操作的方式。

于 2013-08-16T23:47:59.110 回答