通常来讲前端性能优化是指从用户开始访问我们的网站到整个页面完整的展现出来的过程中，通过各种优化策略和优化方法让页面加载的更快，让用户的操作响应更及时，给用户更好的使用体验。 这里我们介绍的是前端性能优化知识的解决方案，从静态资源优化开始入手，从表象深入体系化的讲解页面渲染架构，…

最近在学习前端性能优化方面的知识，看了很多大佬的文章，感觉文章多了比较零散，学习效率不高，所以就整合了一下大佬们写的性能优化的东西，从页面的渲染过程来建立自己的一个前端性能优化的体系。

网站的加载性能可以从减少网络延迟、减少资源数量、减少资源体积和使用缓存 4 个方面来进行优化。 1. 减少网络延迟与网络请求 避免使用着陆页进行重定向。 重定向会导致额外的HTTP请求，造成网络延迟，拖慢网页的呈现。重定向也可能造成额外的DNS查找，TCP握手和TLS协商。 合…

自从我们走上程序员这条崎岖道路以来，web端的性能优化是一个至关重要的话题，前端当然也不例外。而前端性能优化不仅关系到用户体验，还可以显著影响网站的排名、转化率和用户满意度。在这篇文章中，我们将着重深

清楚回流重绘，那么浏览器后半段的过程你基本上就全部掌握了，后半段整个过程就是五个阶段，生成dom树，生成cssom树，两树合并，然后回流，重绘，回流因为要计算属性，需要考虑到如何去对他进行优化，浏览器

在工作中，有时会遇到需要一些不能使用分页方式来加载列表数据的业务情况，对于此，我们称这种列表叫做长列表。比如，在一些外汇交易系统中，前端会实时的展示用户的持仓情况(收益、亏损、手数等)，此时对于用户的持仓列表一般是不能分页的。 在高性能渲染十万条数据(时间分片)一文中，提到了可…

在实际工作中，我们很少会遇到一次性需要向页面中插入大量数据的情况，但是为了丰富我们的知识体系，我们有必要了解并清楚当遇到大量数据时，如何才能在不卡主页面的情况下渲染数据，以及其中背后的原理。 我们对十万条记录进行循环操作，JS的运行时间为187ms，还是蛮快的，但是最终渲染完成…

面试官：后端给你10万+条数据，前端该怎么处理？我：虚拟列表+分页获取，100000+条数据丝滑查看！

后端一次性返回过多数据时，我们前端应该如何渲染，本文提供了两种比较适合方案供大家参考 直接渲染 先看下直接渲染会有什么问题吧 先模拟下这个数据过多时的情景，我生成十万条li，然后每个li都是随机