Ajax GET:多个特定于数据的调用,还是更少的非特定调用?

fug*_*ugu 5 javascript ajax node.js

我正在使用Node.js/express后端和MongoDB数据库开发 Web 应用程序。

以下示例适用于管理仪表板页面,我将在其中显示包含与站点上用户相关的不同信息的卡片。我可能想在示例页面上显示 - 例如:

  1. 各类用户数
  2. 每种用户类型最常见的位置
  3. 每月有多少注册
  4. 最受欢迎的职位

我可以在一条路线中完成这一切,在那里我有一个控制器来执行所有这些任务,并将它们作为一个对象捆绑到一个 url 中,然后我可以使用ajax. 或者,我可以将每个任务拆分为自己的路由/控制器,并对每个任务进行单独的 ajax 调用。我要决定的是在单个页面上进行多个 ajax 调用的最佳实践什么


例子:

我正在建立一个页面,我将在其中使用DataTables为不同类型的用户制作一个交互式表格(目前有两个:mentorsmentees)。这个例子只需要两个数据请求(每个用户类型一个),但我的最后一页将更像是 10。

对于每种用户类型,我正在为每种用户类型进行 ajax get 调用,并根据返回的数据构建表:

用户类型 1 - 学员

$.get('/admin/' + id + '/mentees')
    .done(data => {
        $('#menteeTable').DataTable( {
            data: data,
            "columns": [
                { "data": "username"},
                { "data": "status"}
            ]
        });
    })
Run Code Online (Sandbox Code Playgroud)

用户类型 2 - 导师

$.get('/admin/' + id + '/mentors')
    .done(data => {
        $('#mentorTable').DataTable( {
            data: data,
            "columns": [
                { "data": "username"},
                { "data": "position"}
            ]
        });
    })
Run Code Online (Sandbox Code Playgroud)

然后这需要在我的 Node.js 后端中有两条路由:

router.get("/admin/:id/mentors", getMentors);
router.get("/admin/:id/mentees", getMentees);
Run Code Online (Sandbox Code Playgroud)

还有两个结构相同的控制器(但过滤不同的用户类型):

getMentees(req, res, next){
    console.log("Controller: getMentees");
    let query = { accountType: 'mentee', isAdmin: false };
    Profile.find(query)
        .lean()
        .then(users => {
            return res.json(users);
        })
        .catch(err => {
            console.log(err)
        })
}
Run Code Online (Sandbox Code Playgroud)

这很好用。但是,由于我需要发出多个数据请求,因此我想确保以正确的方式构建它。我可以看到几个选项:

  1. 对每种数据类型进行单独的 ajax 调用,并在后端执行任何繁重的工作(例如统计用户类型和返回) - 如上所述
  2. 对每种数据类型进行单独的 ajax 调用,但在前端做繁重的工作。在上面的例子中,我可以很容易地过滤掉我的 ajax 调用返回的isAdmin用户data
  3. 减少请求不那么精细的数据的 ajax 调用。在上面的例子中,我可以为所有用户进行一次调用(只需要一个路由/控制器),然后data在前端过滤以构建两个表

我想要一些关于哪种策略在采购数据上花费时间最有效的建议


更新

为了澄清这个问题,我可以使用这样的控制器设置来获得与上述相同的结果:

Profile.find(query)
    .lean()
    .then(users => {
        let mentors = [],
        mentees = []

        users.forEach(user => {
            if(user.accountType === 'mentee') {
                mentees.push(user);
            } else if (user.accountType === 'mentor') {
                mentors.push(user);
            }
        });
        return res.json({mentees, mentors});
    })
Run Code Online (Sandbox Code Playgroud)

然后打一个ajax电话,并相应地拆分数据。我的问题是:哪个是首选?