読み込み時間が非常に長い-リクエストが非同期で実行されていません。マングース

概要概要

Vue、Express、MongoDB（mongoose ORM）を使用してアプリケーションを構築しました。ランディングページをロードすると、さまざまなデータビットに対して一連のGETリクエストが行われます。読み込み時間は非常に長く、特定のルートで22秒も記録しました。すべてが非同期で実行されるようにロジックで指定しているにもかかわらず、リクエストが順番に実行されていると私は信じています。

.lean()メソッドを使用するだけでなく、リクエストから返されるオブジェクトのサイズを縮小してみました。これらの試みは数秒短縮されましたが、全体的な問題はリモートで分類されていません。時間はまだ愚かな高いです。例を挙げると：

これから：

// Method to find all users
var users = await User.find({});

に：

// Method to find all users
var users = await User.find({}, "username, uid").lean();

問題のページには、約5つの主要コンポーネントがあります。各コンポーネントはgetリクエストを行っています。これらの1つはチャット列であり、そのコードは次のとおりです。

ChatCol.vue

beforeMount () {
    this.$store.dispatch('retrieve_chat')
}

Store.js（Vuexストアを使用しています）

retrieve_chat (context) {
            return new Promise((resolve, reject) => {
                axios({
                    url: api.dev + 'api/v1/chat',
                    method: 'GET',
                })
                .then(res => {
                    context.commit('set_chat', res.data)
                    resolve(res);
                }).catch(err => {
                    // alert(err)
                    reject(err);
                })
            })
        },

この形式のリクエストは、すべてのコンポーネントで行われています。問題のページにあるそれらの約5。

バックエンド/サーバーコード

行われているリクエストにコンテキストを与えるため。クライアントはルートにヒットします ' http：// localhost：3000 / api / v1 / chat '

サーバーでリクエストを行うコードは次のとおりです。

var Chat = require("../models/ChatMessage");

module.exports = {
    // LIMIT CHAT TO 100 MESSAGES
    async get_chat(req, res) {
        Chat.find({}, function(err, messages) {
            if (err) {
                return res.status(500).send({
                    message: "Interval Server Error", 
                    type: "MONGO_CHAT_DOCUMENT_QUERY", 
                    err: err, 
                })
            }

            if (!messages) {
                return res.status(400).send({
                    message: "Resource not found", 
                    type: "MONGO_CHAT_DOCUMENT_QUERY", 
                    details: "!messages - no messages found", 
                })
            }

            messages.reverse();
            return res.status(200).json({
                messages, 
            });
        }).sort({"_id": -1}).limit(30);
    },
}

Chrome開発ツールの[ネットワーク]タブを見ると、これがリクエストの表示方法です。長く曲がりくねった投稿をお詫びします、私は文字通りこれを引き起こしているものがわかりません

重要な注意点：

mongodbには、データを変更するときにロックするというこの機能があると言われました。そうかもしれないと思いましたが、変更は行われていません。かなり大きなリクエストではありますが、並行して発生するのは3/4のgetリクエストだけですが、それほど長くはかからないはずです。

ネットワークタブのスクリーンショット：

（失敗した要求、および重複した名前付き要求の一部は無視してください）

StackOverflowsempaisを助けてください。これは非常に大きなアプリケーションであり、問​​題が正確に何であるかはわかりません。そのため、詳細を見逃した場合は、お詫びします。明確にする必要があるものはすべて明確にします。