Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

Commit a8a9938

Browse files
committed
fixup! perf(ngAnimate): avoid repeated calls to addClass/removeClass when animation has no duration
1 parent ba37426 commit a8a9938

File tree

4 files changed

+25
-22
lines changed

4 files changed

+25
-22
lines changed

src/ngAnimate/animateCache.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,12 @@ var $$AnimateCacheProvider = function() {
2222
return parts.join(' ');
2323
},
2424

25-
containsCachedAnimationWithDuration: function(key) {
25+
containsCachedAnimationWithoutDuration: function(key) {
2626
var entry = cache[key];
2727

2828
// nothing cached, so go ahead and animate
2929
// otherwise it should be a valid animation
30-
return (!entry || entry.isValid) || false;
30+
return (entry && !entry.isValid) || false;
3131
},
3232

3333
flush: function() {

src/ngAnimate/animateCss.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -342,11 +342,11 @@ var $AnimateCssProvider = ['$animateProvider', /** @this */ function($animatePro
342342

343343
// if a css animation has no duration we
344344
// should mark that so that repeated addClass/removeClass calls are skipped
345-
var hasNoDuration = allowNoDuration || (timings.transitionDuration > 0 || timings.animationDuration > 0);
345+
var hasDuration = allowNoDuration || (timings.transitionDuration > 0 || timings.animationDuration > 0);
346346

347347
// we keep putting this in multiple times even though the value and the cacheKey are the same
348348
// because we're keeping an internal tally of how many duplicate animations are detected.
349-
$$animateCache.put(cacheKey, timings, hasNoDuration);
349+
$$animateCache.put(cacheKey, timings, hasDuration);
350350

351351
return timings;
352352
}
@@ -501,7 +501,7 @@ var $AnimateCssProvider = ['$animateProvider', /** @this */ function($animatePro
501501
}
502502

503503
var stagger, cacheKey = $$animateCache.cacheKey(node, method, options.addClass, options.removeClass);
504-
if (!$$animateCache.containsCachedAnimationWithDuration(cacheKey)) {
504+
if ($$animateCache.containsCachedAnimationWithoutDuration(cacheKey)) {
505505
preparationClasses = null;
506506
return closeAndReturnNoopAnimator();
507507
}
@@ -879,7 +879,7 @@ var $AnimateCssProvider = ['$animateProvider', /** @this */ function($animatePro
879879
$$jqLite.addClass(element, activeClasses);
880880

881881
if (flags.recalculateTimingStyles) {
882-
fullClassName = node.className + ' ' + preparationClasses;
882+
fullClassName = node.getAttribute('class') + ' ' + preparationClasses;
883883
cacheKey = $$animateCache.cacheKey(node, method, options.addClass, options.removeClass);
884884

885885
timings = computeTimings(node, fullClassName, cacheKey, false);

src/ngAnimate/animation.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@ var $$AnimationProvider = ['$animateProvider', /** @this */ function($animatePro
198198
// in the event that we've cached the animation status for this element
199199
// and it's in fact an invalid animation (something that has duration = 0)
200200
// then we should skip all the heavy work from here on
201-
if (!$$animateCache.containsCachedAnimationWithDuration(cacheKey)) {
201+
if ($$animateCache.containsCachedAnimationWithoutDuration(cacheKey)) {
202202
closeFn();
203203
return;
204204
}

test/ngAnimate/animateCacheSpec.js

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -73,24 +73,27 @@ describe('ngAnimate $$animateCache', function() {
7373
expect($$animateCache.count('key2')).toBe(0);
7474
}));
7575

76-
it('should store whether the stored entry is invalid or not', inject(function($$animateCache) {
77-
var validEntry = { someEssentialProperty: true };
78-
var invalidEntry = { someEssentialProperty: false };
76+
describe('containsCachedAnimationWithoutDuration', function() {
77+
it('should return false if the validity of an key is false', inject(function($$animateCache) {
78+
var validEntry = { someEssentialProperty: true };
79+
var invalidEntry = { someEssentialProperty: false };
7980

80-
$$animateCache.put('key1', validEntry, true);
81-
$$animateCache.put('key2', invalidEntry, false);
81+
$$animateCache.put('key1', validEntry, true);
82+
$$animateCache.put('key2', invalidEntry, false);
8283

83-
expect($$animateCache.containsCachedAnimationWithDuration('key1')).toBe(true);
84-
expect($$animateCache.containsCachedAnimationWithDuration('key2')).toBe(false);
85-
}));
84+
expect($$animateCache.containsCachedAnimationWithoutDuration('key1')).toBe(false);
85+
expect($$animateCache.containsCachedAnimationWithoutDuration('key2')).toBe(true);
86+
}));
8687

87-
it('should consider a key valid if it does not exist in the cache', inject(function($$animateCache) {
88-
expect($$animateCache.containsCachedAnimationWithDuration('key2')).toBe(true);
88+
it('should return false if the key does not exist in the cache', inject(function($$animateCache) {
89+
expect($$animateCache.containsCachedAnimationWithoutDuration('key2')).toBe(false);
8990

90-
$$animateCache.put('key2', {}, false);
91-
expect($$animateCache.containsCachedAnimationWithDuration('key2')).toBe(false);
91+
$$animateCache.put('key2', {}, false);
92+
expect($$animateCache.containsCachedAnimationWithoutDuration('key2')).toBe(true);
93+
94+
$$animateCache.flush();
95+
expect($$animateCache.containsCachedAnimationWithoutDuration('key2')).toBe(false);
96+
}));
97+
});
9298

93-
$$animateCache.flush();
94-
expect($$animateCache.containsCachedAnimationWithDuration('key2')).toBe(true);
95-
}));
9699
});

0 commit comments

Comments
 (0)