性能优化（页面滚动时卡顿）性能优化：页面滚动时卡顿

测试反馈一个线上bug，有一个客户的网站在滚动时很卡。
（我做过半年这个项目，去年10月离开这个项目，去做其他项目了，还在bug反馈群里偶尔帮他们改一些其他人搞不定的bug。）
同事说没法复现，他的电脑上不是很卡，我教了他一下，怎么用chrome开发者工具的Performance。
有很多报红的长任务，滚动的时候一段js要执行100多毫秒。不管页面看着卡不卡，优化到不报红，三四十毫秒内就ok了。

文章图片

【性能优化（页面滚动时卡顿）】我看了一下函数调用栈和项目的代码，是因为在一个循环里初始化了很多次lazyload。
大概是这样写的：

window.addEventListener('scroll', () => { 页面上所有的挂件.forEach((挂件) => { if (挂件在页面可视区域) { 播放挂件动画()$('img').lazyload({ // 一些lazyload的配置项 }) } }) })

我询问了一下同事加这段代码的目的，是因为在一些特殊的情况下如果挂件上加了动画，lazyload就失效了，不能让图片显示出来。
让图片显示出来有单独的api，lazyload的初始化全局应该只有一个，
要改成这样：
$('#挂件id img').trigger('appear')
修改后，没有报红的长任务了