perf(): raf updates

ionic/components/app/app.ts

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

ionic/components/nav/nav-controller.ts

@@ -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) {

ionic/components/tap-click/activator.ts

@@ -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;
+    self.x = pointerX;
-    this.y = pointerY;
+    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++) {
+      for (let i = 0; i < self.queue.length; i++) {
-        activatableEle = this.queue[i];
+        activatableEle = self.queue[i];
         if (activatableEle && activatableEle.parentNode) {
-          this.active.push(activatableEle);
+          self.active.push(activatableEle);
-          activatableEle.classList.add(this.activatedClass);
+          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, () => {
+    let self = this;
-      this.clearState();
+    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, () => {
+    function deactivate() {
-      for (let i = 0; i < this.active.length; i++) {
+      for (let i = 0; i < self.active.length; i++) {
-        this.active[i].classList.remove(this.activatedClass);
+        self.active[i].classList.remove(self.activatedClass);
       }
-      this.active = [];
+      self.active = [];
-    });
+    }
+
+    rafFrames(2, deactivate);
   }
 
   disableActivated(ev) {

ionic/util/dom.ts

@@ -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);

ionic/util/feature-detect.ts

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