perf(): raf updates

This commit is contained in:
Adam Bradley
2015-11-20 20:24:17 -06:00
parent f66155904c
commit 002e5e86a6
5 changed files with 50 additions and 39 deletions

View File

@ -27,11 +27,13 @@ export class IonicApp {
* @param {string} val Value to set the document title to.
*/
setTitle(val) {
if (val !== this._title) {
this._title = val;
rafFrames(4, () => {
this._titleSrv.setTitle(this._title);
});
let self = this;
if (val !== self._title) {
self._title = val;
function setAppTitle() {
self._titleSrv.setTitle(self._title);
}
rafFrames(4, setAppTitle);
}
}

View File

@ -182,9 +182,7 @@ export class NavController extends Ion {
this._add(enteringView);
if (opts.preCleanup !== false) {
raf(() => {
this._cleanup(enteringView);
});
this._cleanup(enteringView);
}
if (this.router) {
@ -824,9 +822,7 @@ export class NavController extends Ion {
this._sbComplete();
raf(() => {
this._cleanup();
});
this._cleanup();
}
_cleanup(activeView) {

View File

@ -17,35 +17,40 @@ export class Activator {
downAction(ev, activatableEle, pointerX, pointerY, callback) {
// the user just pressed down
if (this.disableActivated(ev)) return false;
let self = this;
if (self.disableActivated(ev)) return false;
// remember where they pressed
this.x = pointerX;
this.y = pointerY;
self.x = pointerX;
self.y = pointerY;
// queue to have this element activated
this.queue.push(activatableEle);
self.queue.push(activatableEle);
rafFrames(2, () => {
function activateCss() {
let activatableEle;
for (let i = 0; i < this.queue.length; i++) {
activatableEle = this.queue[i];
for (let i = 0; i < self.queue.length; i++) {
activatableEle = self.queue[i];
if (activatableEle && activatableEle.parentNode) {
this.active.push(activatableEle);
activatableEle.classList.add(this.activatedClass);
self.active.push(activatableEle);
activatableEle.classList.add(self.activatedClass);
}
}
this.queue = [];
});
self.queue = [];
}
rafFrames(2, activateCss);
return true;
}
upAction() {
// the user was pressing down, then just let up
rafFrames(this.clearStateDefers, () => {
this.clearState();
});
let self = this;
function activateUp() {
self.clearState();
}
rafFrames(self.clearStateDefers, activateUp);
}
clearState() {
@ -67,14 +72,17 @@ export class Activator {
deactivate() {
// remove the active class from all active elements
this.queue = [];
let self = this;
self.queue = [];
rafFrames(2, () => {
for (let i = 0; i < this.active.length; i++) {
this.active[i].classList.remove(this.activatedClass);
function deactivate() {
for (let i = 0; i < self.active.length; i++) {
self.active[i].classList.remove(self.activatedClass);
}
this.active = [];
});
self.active = [];
}
rafFrames(2, deactivate);
}
disableActivated(ev) {

View File

@ -6,7 +6,12 @@ const nativeCancelRaf = window.cancelAnimationFrame ||
window.webkitCancelAnimationFrame ||
window.webkitCancelRequestAnimationFrame;
export const raf = nativeRaf || function(callback) {
export function raf(callback) {
//console.log('raf', callback.toString().replace(/\s/g, '').replace('function', '').substring(0, 50));
_raf(callback);
}
const _raf = nativeRaf || function(callback) {
let timeCurrent = (new Date()).getTime(),
timeDelta;
@ -31,7 +36,7 @@ export function rafFrames(framesToWait, callback) {
if (framesToWait < 2) {
raf(callback);
} else {
setTimeout(() => {
raf(callback);

View File

@ -21,12 +21,12 @@ export class FeatureDetect {
let featureDetects = {};
FeatureDetect.add('sticky', function(window, document) {
// css position sticky
let ele = document.createElement('div');
ele.style.cssText = 'position:-webkit-sticky;position:sticky';
return ele.style.position.indexOf('sticky') > -1;
});
// FeatureDetect.add('sticky', function(window, document) {
// // css position sticky
// let ele = document.createElement('div');
// ele.style.cssText = 'position:-webkit-sticky;position:sticky';
// return ele.style.position.indexOf('sticky') > -1;
// });
FeatureDetect.add('hairlines', function(window, document, body) {