前端一次性发起多个请求发现返回的请求时间太长 ，是前端原因还是后端

[chenlaocong]

有一个需求是前端一次性请求 10 个接口，等 10 个接口全部请求完毕之后前端再解析。 但是发现 10 个接口中总是有几个接口过慢。差不多 10 秒钟，然后后端打日志，发现数据库请求加后端程序处理只用了 2 秒左右。于是查看前端 network 的时间，发现其余的 8 秒发现是花费在了 ttfb 上，查了一下 TTFB 指的是前端发起请求到后端接受第一个字节所需要的时间。

• 前端同时发起 10 个请求
• 后端数据库用的是 es，每个接口也会访问 mysql，要权限认证
• 后端总共耗时也差不多 2 秒
• 10 个接口只有 2-3 个接口 TTFB 时间长，需要 10 秒左右，其他接口 natwork 时间 2-3 秒就可以

那么问题就来了，这个 TTFB 是前端的原因还是后端的，会不会是 mysql 或者 es 多个访问阻塞了，或者是因为 nginx 配置，或许可能是服务器性能差？要怎么优化这个时间，有经验的大佬请回答下。 PS 我是前端，不太懂服务端这些 nginx 配置啥的

PS： 不知道是不是因为服务器性能的原因 多个请求的时候服务器 cpu 直接 70%--80%了

前端同时请求 6 个接口
- java 查询 es 数据量小的时候 cpu 占用 30% 以下 最长的接口时间 2 秒左右
- java 查询 es 数据量大的时候 cpu 占用 80% 左右 最长的接口时间 10 秒左右
- 估计是因为 java 处理数据的时候内存占用太大了吧

PPPS: 谢谢给位的解答 6 个接口 后端写成一个接口返回时间更慢了 估计就是服务器性能问题了

后端接口和为一个的时候 Content Download 时间需要 8 秒了 ttfb 是 4 秒

[IsaacYoung]

浏览器同一域名下并发请求数量有限制
话说你一开始就 10 个请求是不是考虑下设计上的问题

[oatw]

一楼正解。

如果受制于后端接口，考虑一下把不在首屏显示的内容相关接口延迟请求，最好还是在接口数量的问题上做优化。

[seansong]

ttfb 是服务器响应时间吧，也就是服务器那边慢了，最好彻查一下整个完整的链路，你请求发到服务器之后，首先接收的应该是 nginx 之类的，然后才转发到后端 tomcat 之类，然后才是代码过程，卡住的不一定是代码过程

[fortunezhang]

前端:promose.all
后端：再封装一下

[zqx]

浏览器一个进程页面一般只能并发 6-8 个请求

[chenlaocong]

@IsaacYoung
@oatw
@zqx
谢谢 不过我把接口减少到 6 个也是有一两个是比较慢的

[chenlaocong]

@fortunezhang 目前就是 promise.all 的前端 后端的话是不是因为不能同时接受这个多请求吗

[royzxq]

一次 10 个接口，是个狼灭

[chenlaocong]

@seansong 谢谢 后端代码是没问题的 估计是 nginx 或者是数据库的或者是服务器性能的问题

[learnshare]

前端堵塞吧，把请求分两组（两个 Promise.all ）发出去试试

[chenlaocong]

@royzxq 因为要 10 个接口聚合来进行前端的展示 前端传不同的参数 请求的是后端的同一个封装好的接口

[chenlaocong]

@learnshare 谢谢 我分成两个试一下

[seeusoon]

多个接口换到不同的域名下试试
仔细看一楼说的，同一域名下同时的网络请求数目是有限制的

[chenlaocong]

@seeusoon 我在本地浏览器打开请求本地的后端 是正常速度 崩溃了

[azh7138m]

HTTP2，请

[15651980765]

实在想象不到一次使用 10 个接口的场景；难道不可以让后台合并数据统一返回吗？
之前我们项目也有个列表每一项都发一条请求，导致加载极慢，后来后台合并成一个接口，前端再拆分。

[f056917]

@chenlaocong 用 postman 试呀

[f056917]

话说回来，最好的方法还是重新设计

[CodeCore]

合并接口, 不同的参数, 就多传参数. 也比那么多接口好. 这还是延迟, 如果其中一两个不返回,或者延迟再高点, 不就跪了.

[glaucus]

我和楼主一样，是一个 Dashboard 项目，需要异步同时请求 10 来个接口，看了这个帖子打算回去优化一下了

[learnshare]

@15651980765 #15 也有可能是写接口的人不好调教

[jialing]

接口使用多域名；中间件 聚合接口；

[utf16]

为啥不优化一下 可以合下接口

[xrr2016]

建议合并后端接口

[keelii]

君不见淘宝，京东图片都是 img1,2,3,3 么。分流下。另外看下请求瀑布流看看到底慢在哪里？分流不好做就让后端包一层拼合的接口，批量操作。

[Mazexal]

一般是中间加一层, 你们用 node 来桥接下, 然后包装成一个接口给前端

[hubahuba]

Promise 好一些吧

[meepo3927]

合并成 1-2 个接口吧 ， 可以考虑引入中间层

[laravel]

我们以前都是后端用 laravel，然后中间用 nodejs 写接口，就是从 N 个接口获取数据，然后做业务处理，然后把处理后的数据返回给前端（也是我，就是这么神奇）

[laravel]

后端用 java

[heasy]

合并接口优化或者前端使用 Promise.all

[duan602728596]

这种基本上就是需要后端出一个接口聚合数据，而不是让前端请求 10 个接口

[chenlaocong]

@heasy promise.all 也是相当于同时请求多个接口了吧。我现在就是 promise.all

[fishlium]

10 个接口应该还好吧，看你描述不像是浏览器对域名的限制，仔细排查一下整个过程，上个 http2 可以彻底排除浏览器对域名限制这一项

[colorfulberry]

需要一个 graphiql

[goofool]

只有一台服务器吗？默认长连接，有可能请求是顺序执行的。

[imbacc]

写个 node 可以把

[fortunezhang]

@chenlaocong 不是，后端在并发的情况处理好的话 10 个还是没问题的。 你可以看下浏览器的 network，感觉楼上说的同一个域名并发数有限有可能，你得看下网络，如果真的这样的话就需要加一个域名了。

[morethansean]

卡连接池也是 pending 啊，ttfb 跟连接池有什么关系？

[Ritr]

合并接口吧，不建议用现在的方式

[wszgrcy]

@fortunezhang 哈哈哈，真实

[ochatokori]

http2 或许可以解决问题？

[iyaozhen]

压测工具压一下就知道了
ttfb 一般就是后端慢了，浏览器限制的话能看见请求是开始时间接着结束时间吧

[mikoshu]

先用 node 请求测试下 排除浏览器的问题 那就是后端或者服务器的锅了

[Yrobot]

合并一下 query 吧，和后端商量下搞个页面 init 时的接口。