
获得徽章 8
- { passive: true } 是事件监听时的一个优化选项,主要用于解决 滚动 / 触摸事件的性能问题,核心作用是 提升页面滚动流畅度,避免因事件处理逻辑导致的卡顿。
具体作用:
在浏览器中,当监听 touchmove(触摸滑动)、scroll(滚动)等与页面滚动相关的事件时,浏览器需要判断事件处理函数中是否调用了 event.preventDefault()(用于阻止默认行为,比如阻止页面滚动)。
如果没加 passive: true(现代浏览器中,可能默认设置了passive: true。):浏览器会先等待事件处理函数执行完毕,确认是否有 preventDefault(),再决定是否执行默认滚动行为。这个等待过程可能导致 滚动延迟(尤其是在移动端,会出现 “滚动卡顿”)。
加了 passive: true 后:相当于告诉浏览器:“这个事件处理函数不会调用 preventDefault(),你可以直接执行默认滚动行为,不用等我处理完”。这样浏览器会同步执行默认滚动,避免等待,从而提升滚动流畅度(尤其是高频触发的 touchmove 事件)。
这就是为什么看很多库都手动添加了passive:true的原因,为了滚动优化的操作展开评论点赞 - 🟢 vendor.js:长期缓存(第三方库很少更新)
🟡 app.js:短期缓存(业务代码经常更新)
🔴 runtime.js:不缓存或短期缓存(包含模块映射)
🟣 vendor-async.js:按需加载(路由懒加载时才下载)赞过评论1 - export PATH=/usr/local/node-v20.17.0/bin:$PATH
export NPM_CONFIG_CACHE=/opt/ci-cache/npm
npm set cache "$NPM_CONFIG_CACHE"
export XDG_CACHE_HOME=/opt/ci-cache/node_modules_cache
npm set audit false
npm set fund false
npm set progress false
npm set registryregistry.npmmirror.com
if [ -f package-lock.json ]; then
npm ci --ignore-scripts --loglevel=error
else
npm install --ignore-scripts --loglevel=error
fi
npm run build:${ENV}
前端cicd构建优化展开评论点赞 - 代码提交错了分支,甚至不知道在哪个分支提交的,通过下述方式找回并切到正确分支:
找分支: git log --all --grep="提交的关键词" --oneline
切换到对应的分支:git cherry-pick abc123评论点赞