Question

我有这两个代码来推迟网站上的图片

using System;
using System.Threading.Tasks;
public class Example
{
    public static void Main()
    {
        EventAAsync();
        EventBAsync();

        Console.WriteLine("Press the Enter key to exit the program at any time... ");
        Console.ReadLine();
    }
    private static async Task EventAAsync()
    {
        while (true)
        {
            Task.Run(() =>
            {
                Console.WriteLine("The Elapsed event A was raised at {0}", DateTime.Now);
            });
            await Task.Delay(TimeSpan.FromSeconds(5));
        }
    }
    private static async Task EventBAsync()
    {
        while (true)
        {
            Task.Run(() =>
            {
                Console.WriteLine("The Elapsed event B was raised at {0}", DateTime.Now);
            });
            await Task.Delay(TimeSpan.FromSeconds(2));
        }
    }
}

和

function init() {
   var imgDefer = document.getElementsByTagName('img');
   for (var i=0; i<imgDefer.length; i++) {
   if(imgDefer[i].getAttribute('data-defer')) {
   imgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-defer'));
} } }
window.onload = init;

我想知道哪一个在客户端的表现更好

速度
资源消耗（特别是在移动设备上）

忘记图像数量，图像大小，服务器响应时间。

Answer 1

看起来两者之间可能存在很大差异，但您真正关注的是这一部分：

if(imgDefer[i].getAttribute('data-defer')) {
  imgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-defer'));
}

与

$(this).attr('src', $(this).attr('data-defer'));

其余代码只调用一次，因此它不会对现实生活中的性能产生巨大影响。

我怀疑上述两个片段之间存在决定性的差异。

当然，您应该测量探查器中的所有内容。

比较JavaScript和Jquery代码的性能以推迟图像

1 个答案: