前端性能优化研究

前端性能优化研究

一：前言

一、虽然前端开发做为 GUI 开发的一种,可是存在其特殊性,前端的特殊性就在于“动态”二字，传统 GUI 开发，无论是桌面应用仍是移动端应用都是须要预先下载的,只有先下载应用程序才会在本地操做系统运行。

二、而前端不一样,它是“动态增量”式的,咱们的前端应用每每是实时加载执行的,并不须要预先下载,这就形成了一个问题,前端开发中每每最影响性能的不是什么计算或者渲染,而是加载速度,加载速度会直接影响用户体验和网站留存。

    《Designing for Performance》的做者 Lara Swanson在2014年写过一篇文章《Web性能即用户体验》，她在文中提到“网站页面的快速加载，可以创建用户对网站的信任，增长回访率，大部分的用户其实都期待页面可以在2秒内加载完成，而当超过3秒之后，就会有接近        40%的用户离开你的网站”。

三、值得一提的是,GUI 开发依然有一个共同的特殊之处,那就是 体验性能 ,体验性能并不指在绝对性能上的性能优化,而是回归用户体验这个根本目的,由于在 GUI 开发的领域,绝大多数状况下追求绝对意义上的性能是没有意义的.

四、好比一个动画原本就已经有 60 帧了,你经过一个吊炸天的算法优化到了 120 帧,这对于你的 KPI 毫无用处,由于这个优化自己没有意义,由于除了少数特异功能的异人,没有人能分得清 60 帧和 120 帧的区别,这对于用户的体验没有任何提高。

　  相反,一个首屏加载须要 4s 的网站,你没有任何实质意义上的性能优化,只是加了一个设计姐姐设计的 loading 图,那这也是十分有意义的优化,由于好的 loading 能够减小用户焦虑,让用户感受没有等过久,这就是用户体验级的性能优化.

五、所以,咱们要强调即便没有对性能有实质的优化,经过设计提升用户体验的这个过程,也算是性能优化,由于 GUI 开发直面用户,你让用户有了性能快的 错觉,这也叫性能优化了,毕竟用户以为快,才是真的快...

六、综上所述，实现前端性能优化有两个大方面：一是从代码层面让应用加载速度增快；二是从用户直面效果时，增长loading效果优化用户体验