Merge pull request #1508 from thelounge/xpaw/msg-preview-idle
Render link previews in browser idle event
This commit is contained in:
commit
4d8fae1ab8
@ -3,17 +3,12 @@
|
|||||||
const $ = require("jquery");
|
const $ = require("jquery");
|
||||||
const socket = require("../socket");
|
const socket = require("../socket");
|
||||||
const render = require("../render");
|
const render = require("../render");
|
||||||
|
const utils = require("../utils");
|
||||||
const chat = $("#chat");
|
const chat = $("#chat");
|
||||||
|
|
||||||
socket.on("msg", function(data) {
|
socket.on("msg", function(data) {
|
||||||
if (window.requestIdleCallback) {
|
// We set a maximum timeout of 2 seconds so that messages don't take too long to appear.
|
||||||
// During an idle period the user agent will run idle callbacks in FIFO order
|
utils.requestIdleCallback(() => processReceivedMessage(data), 2000);
|
||||||
// until either the idle period ends or there are no more idle callbacks eligible to be run.
|
|
||||||
// We set a maximum timeout of 2 seconds so that messages don't take too long to appear.
|
|
||||||
window.requestIdleCallback(() => processReceivedMessage(data), {timeout: 2000});
|
|
||||||
} else {
|
|
||||||
processReceivedMessage(data);
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
function processReceivedMessage(data) {
|
function processReceivedMessage(data) {
|
||||||
|
@ -3,9 +3,9 @@
|
|||||||
const $ = require("jquery");
|
const $ = require("jquery");
|
||||||
const renderPreview = require("../renderPreview");
|
const renderPreview = require("../renderPreview");
|
||||||
const socket = require("../socket");
|
const socket = require("../socket");
|
||||||
|
const utils = require("../utils");
|
||||||
|
|
||||||
socket.on("msg:preview", function(data) {
|
socket.on("msg:preview", function(data) {
|
||||||
const msg = $("#msg-" + data.id);
|
// Previews are not as important, we can wait longer for them to appear
|
||||||
|
utils.requestIdleCallback(() => renderPreview(data.preview, $("#msg-" + data.id)), 6000);
|
||||||
renderPreview(data.preview, msg);
|
|
||||||
});
|
});
|
||||||
|
@ -12,7 +12,8 @@ module.exports = {
|
|||||||
resetHeight,
|
resetHeight,
|
||||||
setNick,
|
setNick,
|
||||||
toggleNickEditor,
|
toggleNickEditor,
|
||||||
toggleNotificationMarkers
|
toggleNotificationMarkers,
|
||||||
|
requestIdleCallback,
|
||||||
};
|
};
|
||||||
|
|
||||||
function resetHeight(element) {
|
function resetHeight(element) {
|
||||||
@ -77,3 +78,13 @@ function move(array, old_index, new_index) {
|
|||||||
array.splice(new_index, 0, array.splice(old_index, 1)[0]);
|
array.splice(new_index, 0, array.splice(old_index, 1)[0]);
|
||||||
return array;
|
return array;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function requestIdleCallback(callback, timeout) {
|
||||||
|
if (window.requestIdleCallback) {
|
||||||
|
// During an idle period the user agent will run idle callbacks in FIFO order
|
||||||
|
// until either the idle period ends or there are no more idle callbacks eligible to be run.
|
||||||
|
window.requestIdleCallback(callback, {timeout: timeout});
|
||||||
|
} else {
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user