现如今的页面越来越复杂，一个页面往往承载着大量的元素，最常见的就是一些电商页面，数以万计的商品列表是怎么保证渲染不卡顿的，大家在面对这种长列表渲染的场景下，一般都会采用分页或者虚拟列表来减缓页面一次性

问题描述 我们项目做完，验收通过以后，就需要打包发布上线啦。于是我们执行命令：npm run build打dist包，打包完以后截图如下： 直接打包的chunk-vendors.js太大了 chunk

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第 3 天，点击查看活动详情 默认原则与默认值 默认情况下，它只会影响到按需加载的 chunks。 webpack 将根据以下条件自

前端小伙伴都知道，为了降低包大小，经常会把依赖的前端模块独立打包，比如把 vue、vue-router 打到一个单独的包 vendor 中。另外，常会将存在多个路由的复杂页面的每个页面都单独打一个包，只有访问某个页面的时候，再去下载该页面的js包，以此来加快首页的渲染。 无论是…

性能优化相关的文章其实网上挺多，但是大部分都是在讲如何优化性能，也就是讲方法论。但是在实际工作中，如何量化性能优化也是相当重要的一环。今天本文会介绍谷歌提倡的七个用户体验指标（也可以认为是性能指标），每个指标分别根据以下几点讲解： 首次绘制，FP（First Paint），这个…

让 2019 来得更迅速吧！你现在阅读的是 2019 年前端性能优化年度总结，始于 2016。 22. 确定优先级 要了解你首先要处理什么。列出你全部的静态资源清单（JavaScript、图片、字体、第三方脚本以及页面上的大模块：如轮播图、复杂的信息图表和多媒体内容），并将它们…

我们都知道 setTimeout 和 Promise 并不在一个异步队列中，前者属于宏任务（MacroTask），而后者属于微任务（MicroTask）。 很多文章在介绍宏任务和微任务的差异时，往往用一个类似于 ++i++++ 一样的题目让大家猜测不同任务的执行先后。这么做虽然…