前端性能优化方法

前端性能优化的意义
互联网发展十分迅速，现在做的网站内容越来越多，功能越来越强大，页面也越做越漂亮。随之而来的问题是页面内容越多页面速度就会受到影响。作为用户当然希望访问的页面速度越快越好。所以对于前端工程师来说挑战越来越大。我们只有持续对我们的网站进行性能优化，才能跟的上用户的体验需求。
性能是web网站和应用的支柱。如果网站性能不好，用户会放弃访问你的网站。所以性能和我们网站的利益是相关的。网站最重要的是用户，有用户才会有业务。比如做一个电商网站，用户多了，浏览商品的人和下单的才会多。所谓的下单就是转换率。有多少人下单，业务才有多少收益。同时也希望有足够多的人来围观你的网站，这样可以产生足够多的广告收益。或者和其他平台合作进行带货。还有一点就是现在的搜素引擎会对网站的性能进行评估，高性能的网站会出现在它结果排名靠前的位置。所以如果网站性能不好，在搜索排名中都会落后。因此网站的性能是否好直接关系到你网站的用户体验、流量、搜索、转换率。基于以上问题进行网站性能优化是每个前端工程师都要关注的点。
重要的性能指标和优化目标
性能指标是我们去进行网站优化时可以参考的标准。这个是业界以及前人总结出来的作为指导性的东西。我们要做的就是站在巨人的肩膀上，参照这些指标对网站进行优化。我们可以通过访问淘宝的页面来看看都有哪些重要的性能指标。访问页面打开控制台，点击Lighthouse选项，生成性能测试报告如下：
可以看到这次测试得分是48分。每次测试会受网络的影响，因此也会出现每次测试的结果可能不一样。所以建议每次测试网页性能的时候可以多测试几下，取一个平均值。现在来分析一下测试结果。我们比较关心的指标有First Contentful Paint、Speed Index和Time to interactive。First Contentful Paint表示第一个有内容(文字或者图片)的绘制时间,即不再是白屏的时间。这里耗时1.6s，同时是绿色的