Question

我有一个网站，用户可以在网站上获取收件箱信息和通知。（就像在facebook上一样，你会看到（1）在瓷砖的开头，因为你有通知）

目前我有一个ajax请求，它抓取标题必须显示的数据。它的作用是骗子，但问题是这个文件每10秒调用一次。如果用户有10个页面选项卡，则此文件称为10x10 = 100次..如果我的网站有数千个用户，则了解它将产生多少负载。

我虽然只在活动标签上运行javascript但是如何更新我网站所有已打开标签的标题？还有其他建议吗？

这是我的代码

var oldtitle=$(document).attr("title");
var checker=function(){
    $.ajax({
        url : 'live_title.php',
        type : 'POST',
        success : function(data) {
            ... code ....
            ... code ....
            ... code ....

            if (sum>0) {
                $(document).attr("title", "("+sum+") "+oldtitle);
            }
        }
});
}

setInterval(checker,20000);
checker();

Answer 1

缓存机制似乎是正确的方法。

第一个想法：使用HTTP缓存

请务必将参数添加为查询字符串，并将当前时间戳四舍五入到前一秒的十分之一。

确保您的Web服务器发送正确的HTTP缓存标头才能工作。 GET请求最好。

示例：

$.ajax({
    url : 'live_title.php',
    type : 'GET',
    success : function(data) {
        // code
    },
    data: {t: Math.floor((+new Date())/10000)}
}
// we send a request similar to live_title.php?t=142608488

第二个想法：使用window.localStorage作为辅助本地缓存。

另外还有第一个想法：

var getCache = function(t) {
     if (window.localStorage) {
         var liveTitle = localStorage.getItem('liveTitle') || {};
         return liveTitle[t] || null;
    }
};
var setCache = function(t, data) {
    if (window.localStorage) {
        window.localStorage.setItem('liveTitle', {t:data});
    }
}

var run = function() {
    var t = Math.floor((+new Date())/10000);
    var cache = getCache(t);

    var success = function(data) {
        /*code*/
    };

    if (cache) {
        success(cache);
    }
    else {
        $.ajax({
            url : 'live_title.php',
            type : 'GET',
            success : function(data) {
                setCache(t, data);
                success(data);
            },
            data: {t: t}
        }
    }
}

Answer 2

我认为你不能轻易做到你想做的事。

此外，为了优化，我建议使用缓存：

一次选项卡调用计算消息的方法，执行查询并将结果缓存到简单文件或内存中
在接下来的5分钟内，每次选项卡调用该方法时，使用缓存而不查询数据库
当传递5分钟时，再次执行查询，缓存它等等。

像这样，在100次通话中，你只有一个大请求，其他就像请求js或img文件

动态更新的实时标题（AJAX + jQuery）

2 个答案: