压缩项目打包后的体积大小、提升打包速度，是前端性能优化中非常重要的环节，笔者结合工作中的实践总结，梳理出一些常规且有效的性能优化建议

Web Worker为前端带来了后端的计算能力，十万、百万条数据都是弟弟…… Web Worker扩大了前端的业务边界，减轻了因大量计算造成的UI阻塞

提升首屏的加载速度，是前端性能优化中最重要的环节，这里笔者梳理出一些 `常规且有效` 的首屏优化建议 通过对比优化前后的性能变化，来验证方案的有效性，了解并掌握其原理

Performance 一个在前端开发领域中，无法被忽视的存在，如果我们的开发是一个满足需求就可以的产品，那么可能就用不到它；但是如果我们想对我们的这个产品，做一个极致的优化，那么 Performance 是一个很好的选择，也是一个不容忽视的选择。 大致的介绍了一下工具和api…

也就是说，渲染包含十万条记录，每一条数据仅仅只有图片和文字的简单组合，就要花费将近17秒。页面渲染完成之前，估计用户早已不耐烦，关掉该页面了。这还是版本较新的chrome浏览器。换做其他浏览器，可能效果更差。很显然，传统的方式肯定不合格。 3、循环一个数组对象，可以用for循环…

可能在看到这个问题的第一眼，我们可能会想到这样的解决办法：获取 ul 元素，然后新建 li 元素，并设置好 li 的文本内容和监听器绑定，然后在循环里对 ul 进行 append 操作，即可能想到的是以下代码实现。 实践上述代码，我们发现界面体验很不友好，卡顿感严重。出现卡顿感…

随着 Web 的发展，JavaScript 已经被用于构建大型、复杂的前端应用，在当下的前端中扮演了一个非常重要的角色，因此针对 JavaScript 的优化至关重要。

浏览器除了解析页面 DOM 外，还会对页面包含的静态资源发起请求，请求回来后会执行或使用资源。这一站咱们就来具体看看这个阶段。

到目前为止我们已经介绍了很多环节，也已经有了许多「性能优化的武器」。不过不要掉以轻心，后续仍然有大量的工作等待我们来优化。这里就到了客户端接收响应的阶段了。