初始化Vue.js時延遲

Question

我將Vue.js嵌入到現有應用程序中。

像這樣初始化Vue.js時：

new Vue({
    el: "#myDomElement",
    data: myData,
    computed: {
        price: function() { 
            return _this.productPrice(); 
        },
    },
    created: function() { console.log("Vue created."); },
    beforeCompile: function() { console.log("Vue about to compile."); },
    compiled: function() { console.log("Vue compiled."); },
    ready: function() { console.log("Vue ready."); },
});

此時，我的代碼中出現了大約10秒鍾的延遲。 在此延遲之后，生命周期鈎子（創建的，beforeCompile等）立即全部觸發。

延遲與視圖無關，即使myDomElement為空div也會發生延遲。

可能相關：

• myData對象也不小但也不大（JSON.stringified時為28KB）

• Vue.js初始化發生在一個模塊中，該模塊通過modules.export導出，然后由Webpack打包

Answer 1

事實證明，數據對象myData太復雜了（它比我在原始帖子中所說的要大得多）。

Vue.js文檔狀態

不建議觀察復雜的物體。

請參閱Vue.js文檔

我們能夠將myData對象的某些數據移動到另一個沒有數據綁定的對象，並使應用程序再次平穩運行。