perf(angular): disable async queue (#16118)

manucorporat · web-flow · commit c2f58038f57f · 2018-10-30T20:33:46.000+01:00
* perf(angular): disable async queue

* wip

* update proxy
diff --git a/angular/src/app-initialize.ts b/angular/src/app-initialize.ts
@@ -14,6 +14,7 @@ export function appInitialize(config: Config) {
       const Ionic = win.Ionic = win.Ionic || {};
 
       Ionic.config = config;
+      Ionic.asyncQueue = false;
 
       Ionic.ael = (elm, eventName, cb, opts) => {
         if (elm.__zone_symbol__addEventListener && skipZone(eventName)) {
@@ -45,12 +46,10 @@ export function appInitialize(config: Config) {
   };
 }
 
-const SKIP_ZONE = [
-  'scroll',
-  'touchmove',
-  'mousemove'
+const PASS_ZONE = [
+  'click',
 ];
 
 function skipZone(eventName: string) {
-  return SKIP_ZONE.indexOf(eventName) >= 0;
+  return PASS_ZONE.indexOf(eventName) < 0;
 }
diff --git a/angular/src/directives/navigation/tabs-delegate.ts b/angular/src/directives/navigation/tabs-delegate.ts
@@ -17,7 +17,7 @@ export class TabsDelegate {
 
   @HostListener('ionTabButtonClick', ['$event'])
   onTabbarClick(ev: UIEvent) {
-    const tabElm: HTMLIonTabElement = ev.detail as any;
+    const tabElm: HTMLIonTabButtonElement = ev.detail as any;
     if (this.router && tabElm && tabElm.href) {
       this.router.navigateByUrl(tabElm.href);
     }
diff --git a/angular/src/directives/proxies.ts b/angular/src/directives/proxies.ts
diff --git a/angular/src/types/interfaces.ts b/angular/src/types/interfaces.ts
@@ -4,6 +4,7 @@ export interface IonicGlobal {
   ael?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
   raf?: (ts: number) => void;
   rel?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
+  asyncQueue?: boolean;
 }
 
 export interface IonicWindow extends Window {
diff --git a/core/package.json b/core/package.json
@@ -30,7 +30,7 @@
     "ionicons": "4.4.6"
   },
   "devDependencies": {
-    "@stencil/core": "0.15.1",
+    "@stencil/core": "0.15.2-0",
     "@stencil/sass": "0.1.1",
     "@stencil/utils": "latest",
     "@types/jest": "^23.3.1",
diff --git a/core/src/components/tab-bar/test/scenarios/camera.svg b/core/src/components/tab-bar/test/scenarios/camera.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-camera"><path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"></path><circle cx="12" cy="13" r="4"></circle></svg>
diff --git a/core/src/components/tab-bar/test/scenarios/index.html b/core/src/components/tab-bar/test/scenarios/index.html
@@ -8,6 +8,24 @@
   <script src="../../../../../dist/ionic.js"></script>
   <link rel="stylesheet" href="../../../../../css/ionic.bundle.css">
   <link rel="stylesheet" href="../../../../../scripts/testing/styles.css">
+
+  <style>
+  .custom-tabbar {
+    overflow: visible;
+    contain: none;
+  }
+  .main-tab {
+    --padding-top: 18px;
+
+    border-radius: 50%;
+    max-width: 80px;
+    height: 80px;
+    background: #848484;
+    color: white;
+    font-size: 16px;
+  }
+
+  </style>
 </head>
 
 <body>
@@ -187,6 +205,24 @@
       </ion-tab-button>
     </ion-tab-bar>
 
+    <!-- Custom TabBar -->
+    <ion-tab-bar selected-tab="1" class="custom-tabbar">
+      <ion-tab-button tab='1'>
+        <ion-label>Location</ion-label>
+        <ion-icon name="navigate"></ion-icon>
+      </ion-tab-button>
+
+      <ion-tab-button tab='2' class="main-tab">
+        <ion-icon src="/src/components/tab-bar/test/scenarios/camera.svg"></ion-icon>
+      </ion-tab-button>
+
+      <ion-tab-button tab='3'>
+        <ion-label>Radio</ion-label>
+        <ion-icon name="musical-notes"></ion-icon>
+      </ion-tab-button>
+
+    </ion-tab-bar>
+
   </ion-app>
 
 </body>
diff --git a/core/stencil.config.ts b/core/stencil.config.ts
@@ -65,6 +65,7 @@ export const config: Config = {
     },
     {
       type: 'angular',
+      useDirectives: false,
       componentCorePackage: '@ionic/core',
       directivesProxyFile: '../angular/src/directives/proxies.ts',
       directivesArrayFile: '../angular/src/directives/proxies-list.txt',

Original file line number	Diff line number	Diff line change
`@@ -17,7 +17,7 @@ export class TabsDelegate {`
`17`	`17`
`18`	`18`	`@HostListener('ionTabButtonClick', ['$event'])`
`19`	`19`	`onTabbarClick(ev: UIEvent) {`
`20`		`- const tabElm: HTMLIonTabElement = ev.detail as any;`
	`20`	`+ const tabElm: HTMLIonTabButtonElement = ev.detail as any;`
`21`	`21`	`if (this.router && tabElm && tabElm.href) {`
`22`	`22`	`this.router.navigateByUrl(tabElm.href);`
`23`	`23`	`}`
Original file line number	Diff line number	Diff line change
`@@ -4,6 +4,7 @@ export interface IonicGlobal {`
`4`	`4`	`ael?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;`
`5`	`5`	`raf?: (ts: number) => void;`
`6`	`6`	`rel?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;`
	`7`	`+ asyncQueue?: boolean;`
`7`	`8`	`}`
`8`	`9`
`9`	`10`	`export interface IonicWindow extends Window {`
Original file line number	Diff line number	Diff line change
`@@ -65,6 +65,7 @@ export const config: Config = {`
`65`	`65`	`},`
`66`	`66`	`{`
`67`	`67`	`type: 'angular',`
	`68`	`+ useDirectives: false,`
`68`	`69`	`componentCorePackage: '@ionic/core',`
`69`	`70`	`directivesProxyFile: '../angular/src/directives/proxies.ts',`
`70`	`71`	`directivesArrayFile: '../angular/src/directives/proxies-list.txt',`