Question

我们有一个庞大的企业Angular应用程序，我们遇到性能问题，有时它会杀死浏览器（内存不足）。我们使用浏览器开发者分析器（ DevTools ）调试应用程序，并且在$apply()函数上花费了大量时间。

我做了一些研究，看起来$apply()每次角度运行摘要周期时都会被触发。

我注意到控制器中有大量的$watch()。该体系结构完全基于$watch()（它是一种订阅/观察模式）。因此，我们除了$watch()之外别无选择。我不被允许发布此应用程序的任何代码。

所以，我的问题是，是否有一种更高效的监视数据结构的替代方案，因此可以提高应用程序的性能？

Answer 1

如果没有特定的代码示例，很难确定性能问题的位置。但是你的问题的答案是肯定的。事实上，我写了一篇关于它的文章，不久：optimizing-code-object-defineproperty-scope-watch-angularjs

使用Object.defineProperty（）可以更高效地实现手表的相同功能（请参阅下面的代码示例）注意：IE8及以下版本不支持此解决方案。

var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', MyCtrl);
myApp.service('efficientWatch', efficientWatch);


MyCtrl.$inject = ['efficientWatch'];

function MyCtrl(efficientWatch) {
    var self = this;
    efficientWatch.watch('reactionText', self, function (newval) {
        if (newval == 'watched') {
            self.reacted = true;
        }else{
            self.reacted = false;
        };
    });
    self.reacted = false;
    self.placeholder = 'type the watched word';
}

function efficientWatch() {
    this.watch = function (name, controllerProto, func) {
        Object.defineProperty(controllerProto,
        name, {
            get: function () {
                return this._personName;
            },
            set: function (newValue) {
                this._personName = newValue;

                //Call method on update
                if (typeof func == 'function') func(newValue);
            },
            enumerable: true,
            configurable: true
        });
    };
};

希望这对你有帮助;）

在AngularJs中有更好的替代$ watch吗？

1 个答案: