我有一个javascript计时器。
它以200ms的间隔刷新img src。
我看了一眼画布上的物体。我不确定是否建议使用画布而不是img元素?
我正在对两者进行测试,看不到任何性能差异。
这是我使用计时器的代码/ig:
这是我的代码:
var timer4x4
var cache4x4 = new Image();
var alias = 'test';
var lastUpdate = 0;
function setImageSrc4x4(src) {
live4x4.src = src;
timer4x4 = window.setTimeout(swapImages4x4, 200);
}
function swapImages4x4() {
cache4x4.onload = function () {
setImageSrc4x4(cache4x4.src);
};
cache4x4.onerror = function () {
setImageSrc4x4("http://127.0.0.1/images/ERROR.jpg");
};
cache4x4.src = null;
cache4x4.src = 'http://127.0.0.1/Cloud/LiveXP.ashx?id=' + createGuid() + '&Alias=' + alias + '&ReSync=' + reSync;
reSync = 0;
}
*nb将在一位中添加画布代码
我正在将图像从我的客户端台式电脑流式传输到我的网络服务器。我正在尝试显示尽可能多的图像(FPS)。该图像是4个较小图像的容器。在客户端上缝合并发送到服务器。
我在谷歌上搜索过,它说如果使用画布进行像素操作和消除。
但是,我只是在做动画。
感谢
canvas
元素的设计目的是绘制/编辑/与其中的图像交互。如果你所做的只是显示图像,那么你就不需要了,简单的img
是语义正确的选择(还有在更多设备上兼容的额外好处)。
在这两种情况下,性能将是相似的(如果不相同的话),因为唯一会发生的事情就是下载图像。
虽然从性能角度来看,您不会注意到太大的差异,因为您还不能完全依赖HTML5支持,所以现在最好使用img
-解决方案。