何时使用“带有（... ms）延迟的JavaScript窗口调整大小事件”是有益的

Question

下面的代码使用计时器来创建“具有（... ms）延迟的JavaScript窗口调整大小事件”，在这种情况下，用于显示和隐藏菜单。简而言之，延迟可以最小化调整大小事件可能使用的机器资源。但是，延迟并没有足够快地隐藏菜单并减少所需效果的延迟，似乎首先打败了物体的延迟。

下面的函数在Wordpress中的文档就绪，匿名函数中。希望对此有所了解。谢谢。

 var resizeTimer;
    $(window).on('load resize', function () {
        clearTimeout(resizeTimer);
        resizeTimer = setTimeout(function () {
            if ($(window).width() > 768) {
                $('ul.menu-1').show();
                $('.toggle').hide();
            } else {
                $('ul.menu-1').hide();
                $('.toggle').show();
            }
        }, 100);
    });

Answer 1

我认为这个想法是，当窗口调整大小时，它会触发很多次。因此，当您真正需要执行一次时，快速调整到新大小可以调用代码x次。

但这是一个常见的陷阱。大多数不断调整窗口大小的人都是开发人员和设计人员 - 而不是普通客户/受众。我不认为删除延迟会影响性能（除非你有一个调整大小的狂热开发者去屏幕上的城镇）。

此外，所有这些代码都可以在没有JS的情况下完成 - 只需在CSS中使用媒体查询。

我的个人意见是放弃JS调整大小的解决方案以显示/隐藏菜单并使用CSS +媒体查询解决方案。这将对您的资源有很多帮助，并且更易于维护。