diff --git a/ionic/components/app/structure.scss b/ionic/components/app/structure.scss
index ce1362fb29..e6b1336b15 100644
--- a/ionic/components/app/structure.scss
+++ b/ionic/components/app/structure.scss
@@ -59,6 +59,8 @@ ion-navbar {
   &.show-navbar {
     display: flex;
   }
+
+  transform: translateZ(0);
 }
 
 ion-view,
@@ -77,6 +79,8 @@ ion-view,
   &.show-view {
     display: flex;
   }
+
+  transform: translateZ(0);
 }
 
 ion-toolbar {
diff --git a/ionic/components/nav-bar/nav-bar.scss b/ionic/components/nav-bar/nav-bar.scss
index acecad5bd2..eb09323910 100644
--- a/ionic/components/nav-bar/nav-bar.scss
+++ b/ionic/components/nav-bar/nav-bar.scss
@@ -51,6 +51,8 @@ ion-title {
   // used to notify JS when the title has been rendered
   animation-duration: 1ms;
   animation-name: nodeInserted;
+
+  transform: translateZ(0);
 }
 
 .navbar-inner-title {
@@ -68,3 +70,7 @@ ion-title {
 .navbar-title-hide {
   opacity: 0;
 }
+
+.back-button {
+  transform: translateZ(0);
+}
diff --git a/ionic/components/nav/test/basic/index.js b/ionic/components/nav/test/basic/index.js
index a6d074d726..c94aea79d5 100644
--- a/ionic/components/nav/test/basic/index.js
+++ b/ionic/components/nav/test/basic/index.js
@@ -8,7 +8,9 @@ import {FirstPage} from './pages/first-page';
 
 @Component({ selector: 'ion-app' })
 @View({
-  templateUrl: 'main.html',
+  template: `
+    <ion-nav [initial]="initial"></ion-nav>
+  `,
   directives: [Nav]
 })
 class IonicApp {
diff --git a/ionic/components/nav/test/basic/main.html b/ionic/components/nav/test/basic/main.html
deleted file mode 100644
index 162fbd5049..0000000000
--- a/ionic/components/nav/test/basic/main.html
+++ /dev/null
@@ -1,15 +0,0 @@
-
-<ion-nav [initial]="initial"></ion-nav>
-
-<style>
-  f {
-    display: block;
-    margin: 10px auto;
-    max-width: 200px;
-    height: 200px;
-    background: blue;
-  }
-  f:last-of-type {
-    background: red;
-  }
-</style>
diff --git a/ionic/components/nav/test/basic/pages/first-page.html b/ionic/components/nav/test/basic/pages/first-page.html
deleted file mode 100644
index 8e7b0468d1..0000000000
--- a/ionic/components/nav/test/basic/pages/first-page.html
+++ /dev/null
@@ -1,19 +0,0 @@
-
-<ion-navbar *navbar><ion-title>First Page Header: {{ val }}</ion-title></ion-navbar>
-
-<!-- <ion-toolbar>
-  First Page Sub Header: {{ val }}
-</ion-toolbar> -->
-
-<ion-content class="padding">
-
-  <p>First Page: {{ val }}</p>
-
-  <p>
-    <button class="button" (click)="push()">Push (Go to 2nd)</button>
-  </p>
-
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-
-</ion-content>
diff --git a/ionic/components/nav/test/basic/pages/first-page.js b/ionic/components/nav/test/basic/pages/first-page.js
index b11311121a..88fbec0e31 100644
--- a/ionic/components/nav/test/basic/pages/first-page.js
+++ b/ionic/components/nav/test/basic/pages/first-page.js
@@ -7,7 +7,22 @@ import {SecondPage} from './second-page';
 
 @Component({selector: 'ion-view'})
 @View({
-  templateUrl: 'pages/first-page.html',
+  template: `
+    <ion-navbar *navbar><ion-title>First Page Header: {{ val }}</ion-title></ion-navbar>
+
+    <ion-content class="padding">
+
+      <p>First Page: {{ val }}</p>
+
+      <p>
+        <button class="button" (click)="push()">Push (Go to 2nd)</button>
+      </p>
+
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
+    </ion-content>
+  `,
   directives: [NavbarTemplate, Navbar, Content]
 })
 export class FirstPage {
diff --git a/ionic/components/nav/test/basic/pages/second-page.html b/ionic/components/nav/test/basic/pages/second-page.html
deleted file mode 100644
index 21c53cb059..0000000000
--- a/ionic/components/nav/test/basic/pages/second-page.html
+++ /dev/null
@@ -1,34 +0,0 @@
-
-<ion-navbar *navbar><ion-title>Second Page Header</ion-title></ion-navbar>
-
-<!-- <ion-toolbar>
-  Second Page Sub Header
-</ion-toolbar>
-
-<ion-toolbar>
-  Second Page Sub Sub Header
-</ion-toolbar> -->
-
-<ion-content class="padding">
-
-  <p>
-    <button class="button" (click)="pop()">Pop (Go back to 1st)</button>
-  </p>
-
-  <p>
-    <button class="button" (click)="push()">Push (Go to 3rd)</button>
-  </p>
-
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-
-</ion-content>
-
-<!-- <ion-toolbar>
-  Second Page Sub Footer
-</ion-toolbar>
-
-<ion-toolbar>
-  Second Page Footer
-</ion-toolbar>
- -->
diff --git a/ionic/components/nav/test/basic/pages/second-page.js b/ionic/components/nav/test/basic/pages/second-page.js
index 22de60bda8..c56c30f14f 100644
--- a/ionic/components/nav/test/basic/pages/second-page.js
+++ b/ionic/components/nav/test/basic/pages/second-page.js
@@ -7,7 +7,24 @@ import {ThirdPage} from './third-page';
 
 @Component({selector: 'ion-view'})
 @View({
-  templateUrl: 'pages/second-page.html',
+  template: `
+    <ion-navbar *navbar><ion-title>Second Page Header</ion-title></ion-navbar>
+
+    <ion-content class="padding">
+
+      <p>
+        <button class="button" (click)="pop()">Pop (Go back to 1st)</button>
+      </p>
+
+      <p>
+        <button class="button" (click)="push()">Push (Go to 3rd)</button>
+      </p>
+
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
+    </ion-content>
+  `,
   directives: [NavbarTemplate, Navbar, Content]
 })
 export class SecondPage {
diff --git a/ionic/components/nav/test/basic/pages/third-page.html b/ionic/components/nav/test/basic/pages/third-page.html
deleted file mode 100644
index 99ac3a08a9..0000000000
--- a/ionic/components/nav/test/basic/pages/third-page.html
+++ /dev/null
@@ -1,17 +0,0 @@
-
-<ion-navbar *navbar><ion-title>Third Page Header</ion-title></ion-navbar>
-
-<!-- <ion-toolbar>
-  Third Page Footer
-</ion-toolbar> -->
-
-<ion-content class="padding">
-
-  <p>
-    <button class="button" (click)="pop()">Pop (Go back to 2nd)</button>
-  </p>
-
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-  <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-
-</ion-content>
diff --git a/ionic/components/nav/test/basic/pages/third-page.js b/ionic/components/nav/test/basic/pages/third-page.js
index 26c1e2f830..19a15f911b 100644
--- a/ionic/components/nav/test/basic/pages/third-page.js
+++ b/ionic/components/nav/test/basic/pages/third-page.js
@@ -6,7 +6,20 @@ import {NavController, NavbarTemplate, Navbar, Content} from 'ionic/ionic';
 
 @Component({selector: 'ion-view'})
 @View({
-  templateUrl: 'pages/third-page.html',
+  template: `
+    <ion-navbar *navbar><ion-title>Third Page Header</ion-title></ion-navbar>
+
+    <ion-content class="padding">
+
+      <p>
+        <button class="button" (click)="pop()">Pop (Go back to 2nd)</button>
+      </p>
+
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+      <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
+    </ion-content>
+  `,
   directives: [NavbarTemplate, Navbar, Content]
 })
 export class ThirdPage {
diff --git a/scripts/e2e/angular.template.html b/scripts/e2e/angular.template.html
index 54c7d3ab47..84c768eb71 100644
--- a/scripts/e2e/angular.template.html
+++ b/scripts/e2e/angular.template.html
@@ -2,8 +2,24 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8" />
-  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
+
+  <!-- https://www.chromium.org/developers/design-documents/chromium-graphics/how-to-get-gpu-rasterization -->
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+
   <link href="/css/ionic.css" rel="stylesheet">
+  <style>
+    /* hack to create tall scrollable areas for testing using <f></f> */
+    f {
+      display: block;
+      margin: 10px auto;
+      max-width: 200px;
+      height: 200px;
+      background: blue;
+    }
+    f:last-of-type {
+      background: red;
+    }
+  </style>
 </head>
 <body>