有一个需求是前端一次性请求 10 个接口，等 10 个接口全部请求完毕之后前端再解析。 但是发现 10 个接口中总是有几个接口过慢。差不多 10 秒钟，然后后端打日志，发现数据库请求加后端程序处理只用了 2 秒左右。于是查看前端 network 的时间，发现其余的 8 秒发现是花费在了 ttfb 上，查了一下 TTFB 指的是前端发起请求到后端接受第一个字节所需要的时间。
那么问题就来了，这个 TTFB 是前端的原因还是后端的，会不会是 mysql 或者 es 多个访问阻塞了，或者是因为 nginx 配置，或许可能是服务器性能差？要怎么优化这个时间，有经验的大佬请回答下。 PS 我是前端，不太懂服务端这些 nginx 配置啥的
 |
1
IsaacYoung Jul 8, 2019 via iPhone
浏览器同一域名下并发请求数量有限制
话说你一开始就 10 个请求是不是考虑下设计上的问题 |
 |
2
oatw Jul 8, 2019
一楼正解。
如果受制于后端接口，考虑一下把不在首屏显示的内容相关接口延迟请求，最好还是在接口数量的问题上做优化。 |
 |
3
seansong Jul 8, 2019
ttfb 是服务器响应时间吧，也就是服务器那边慢了，最好彻查一下整个完整的链路，你请求发到服务器之后，首先接收的应该是 nginx 之类的，然后才转发到后端 tomcat 之类，然后才是代码过程，卡住的不一定是代码过程
|
 |
4
fortunezhang Jul 8, 2019  1
前端:promose.all
后端：再封装一下 |
 |
5
zqx Jul 8, 2019 via Android
浏览器一个进程页面一般只能并发 6-8 个请求
|
 |
6
chenlaocong OP |
|
7
chenlaocong OP @fortunezhang 目前就是 promise.all 的前端 后端的话是不是因为不能同时接受这个多请求吗
|
 |
8
royzxq Jul 8, 2019
一次 10 个接口，是个狼灭
|
|
9
chenlaocong OP @seansong 谢谢 后端代码是没问题的 估计是 nginx 或者是数据库的或者是服务器性能的问题
|
 |
10
learnshare Jul 8, 2019
前端堵塞吧，把请求分两组（两个 Promise.all ）发出去试试
|
|
11
chenlaocong OP @royzxq 因为要 10 个接口聚合来进行前端的展示 前端传不同的参数 请求的是后端的同一个封装好的接口
|
|
12
chenlaocong OP @learnshare 谢谢 我分成两个试一下
|
 |
13
seeusoon Jul 8, 2019
多个接口换到不同的域名下试试
仔细看一楼说的，同一域名下同时的网络请求数目是有限制的 |
|
14
chenlaocong OP @seeusoon 我在本地浏览器打开请求本地的后端 是正常速度 崩溃了
|
 |
15
azh7138m Jul 8, 2019
HTTP2，请
|
 |
16
15651980765 Jul 8, 2019
实在想象不到一次使用 10 个接口的场景；难道不可以让后台合并数据统一返回吗？
之前我们项目也有个列表每一项都发一条请求，导致加载极慢，后来后台合并成一个接口，前端再拆分。 |
 |
17
p8YFk4f3E8SJ3aEv Jul 8, 2019
@chenlaocong 用 postman 试呀
|
|
18
p8YFk4f3E8SJ3aEv Jul 8, 2019
话说回来，最好的方法还是重新设计
|
 |
19
CodeCore Jul 8, 2019
合并接口, 不同的参数, 就多传参数. 也比那么多接口好. 这还是延迟, 如果其中一两个不返回,或者延迟再高点, 不就跪了.
|
 |
20
glaucus Jul 8, 2019
我和楼主一样，是一个 Dashboard 项目，需要异步同时请求 10 来个接口，看了这个帖子打算回去优化一下了
|
|
21
learnshare Jul 8, 2019
@15651980765 #15 也有可能是写接口的人不好调教
|
 |
22
jialing Jul 8, 2019
接口使用多域名；中间件 聚合接口；
|
 |
23
utf16 Jul 8, 2019
为啥不优化一下 可以合下接口
|
 |
24
xrr2016 Jul 8, 2019 via Android
建议合并后端接口
|
 |
25
keelii Jul 8, 2019 1
君不见淘宝，京东图片都是 img1,2,3,3 么。分流下。另外看下请求瀑布流看看到底慢在哪里？分流不好做就让后端包一层拼合的接口，批量操作。
|
 |
26
Mazexal Jul 8, 2019
一般是中间加一层, 你们用 node 来桥接下, 然后包装成一个接口给前端
|
 |
27
hubahuba Jul 8, 2019
Promise 好一些吧
|
 |
28
meepo3927 Jul 8, 2019
合并成 1-2 个接口吧 ， 可以考虑引入中间层
|
 |
29
laravel Jul 8, 2019
我们以前都是后端用 laravel，然后中间用 nodejs 写接口，就是从 N 个接口获取数据，然后做业务处理，然后把处理后的数据返回给前端（也是我，就是这么神奇）
|
|
30
laravel Jul 8, 2019
后端用 java
|
 |
31
heasy Jul 8, 2019 via iPhone
合并接口优化或者前端使用 Promise.all
|
 |
32
duan602728596 Jul 8, 2019 via iPhone
这种基本上就是需要后端出一个接口聚合数据，而不是让前端请求 10 个接口
|
|
33
chenlaocong OP @heasy promise.all 也是相当于同时请求多个接口了吧。我现在就是 promise.all
|
 |
34
fishlium Jul 8, 2019
10 个接口应该还好吧，看你描述不像是浏览器对域名的限制，仔细排查一下整个过程，上个 http2 可以彻底排除浏览器对域名限制这一项
|
 |
35
colorfulberry Jul 8, 2019
需要一个 graphiql
|
 |
36
goofool Jul 8, 2019
只有一台服务器吗？默认长连接，有可能请求是顺序执行的。
|
 |
37
imbacc Jul 8, 2019
写个 node 可以把
|
|
38
fortunezhang Jul 8, 2019
@chenlaocong 不是，后端在并发的情况处理好的话 10 个还是没问题的。 你可以看下浏览器的 network，感觉楼上说的同一个域名并发数有限有可能，你得看下网络，如果真的这样的话就需要加一个域名了。
|
 |
39
morethansean Jul 8, 2019
卡连接池也是 pending 啊，ttfb 跟连接池有什么关系？
|
 |
40
Ritr Jul 8, 2019
合并接口吧，不建议用现在的方式
|
 |
41
wszgrcy Jul 8, 2019 via Android
@fortunezhang 哈哈哈，真实
|
 |
42
ochatokori Jul 8, 2019 via Android
http2 或许可以解决问题？
|
 |
43
iyaozhen Jul 8, 2019 via Android
压测工具压一下就知道了
ttfb 一般就是后端慢了，浏览器限制的话能看见请求是开始时间接着结束时间吧 |
 |
44
mikoshu Jul 9, 2019
先用 node 请求测试下 排除浏览器的问题 那就是后端或者服务器的锅了
|
 |
45
Yrobot Mar 5, 2021 via Android
合并一下 query 吧，和后端商量下搞个页面 init 时的接口。
|
Select Language