angular 首屏加载优化_快速了解前端性能优化

前言

在前端开发的过程中，很多时候除了日常的需求开发以外，我们还需要对我们的页面进行性能优化，那么这次就分享一下前端开发我能想到的一些优化方案进行总结。

前端性能优化是什么？

有很多小伙伴无论是日常遇到优化需求或者面试的时候被问到性能优化，往往并没有很好的完整分析出性能瓶颈在那里。面试过程中，很多时候并没有能很系统的去回答完整前端的性能优化的方案。

什么是前端性能优化呢？我会分为以下两大部分：

1. 渲染优化
2. 加载优化
3. 运行优化

性能优化如何分析

在对页面进行优化前，必须搞清楚到底需要优化的点在那里，是首屏加载很慢？资源加载慢？等等。那么我们需要如何分析一个页面需要如何优化呢？

首先我们必须要搞清楚你当前是优化首屏慢（白屏时间长），可交互时间长，在现在的前端开发中，往往我们通过performance来查看页面的onload时间或者domReady时间其实并不可靠。举个例子，我们一般现在开发已经越来越多使用React或者Vue这一类框架进行开发，那么我们的页面渲染大量依赖数据，那么获取数据的时候长短就显得很重要。所以会发现使用了React或者Vue的页面，在不做任何优化的情况下，白屏的时间往往会比以前是jq或者直接后端套模板输出html要慢得