前端页面的性能关乎用户体验，其重要性不言而喻。如果开发者千辛万苦制作的页面因为性能的原因不能很好的展示给用户，那之前的工作就没有了价值。前端性能优化的技巧是每一个前端开发者都必须掌握的基本技能。

前端性能优化的技巧很多文章都有提及，我结合自己实际经验和思考，和大家分享一些不同的优化思路。

优化方向1：减少HTTP请求的次数

HTTP请求占据页面加载时间的大部分，减少请求的次数能明显的减少页面加载时间，提升使用体验。为什么HTTP请求耗时呢？

一个HTTP请求的过程可以分为以下步骤：
域名解析 --> 3次握手建立TCP连接 --> 后发起http请求 --> 服务器响应http请求

虽然HTTP请求的效率很高，时间很短。但是如果请求的次数过多，请求的数据过大，请求耗时就非常严重。这种情况如下有经验的同学相信都深有体会。那么从哪些方面来减少HTTP请求的次数呢？

（1）合并 js/css 文件

多个js/css文件可以整合到一起，合并的时候也要同时考虑文件体积大小的问题。将请求的数量减少到合理的范围。

（2）批量获取/传输数据

数据的获取和发送经常容易导致性能问题。有很多程序员在本机调试的时候一切正常，一上线就卡的不行。就是没有考虑到批操作的问题，本地的测试环境数据量小，网络传输快，即使循环发送请求也能很快响应，但是线上环境就不是这么回事了。

对于批量操作要把需要的数据一起获取或者发送，后台也一定要提供批量操作的接口。对于实时处理的情况，比如输入框实时搜索（后台搜索），可以等用户全部输入完再请求搜索结果，或者设置延迟debounce。

（3）使用缓存

将脚本，图片等资源缓存在客户端，不必每次都从服务器获取。这样也能减少请求的次数。方法可以是设置过期时间实现。

（4）按需加载/懒加载