performance improv

terminus-core/src/components/appRoot.component.pug

@@ -38,7 +38,7 @@ title-bar(
                 button.btn.btn-secondary.btn-tab-bar(
                     [title]='button.title',
                     (click)='button.click && button.click()',
-                    [innerHTML]='sanitizeIcon(button.icon)',
+                    [fastHtmlBind]='button.icon',
                     ngbDropdownToggle,
                 )
                 div(*ngIf='button.submenu', ngbDropdownMenu)
@@ -49,7 +49,7 @@ title-bar(
                     )
                         .icon-wrapper(
                             *ngIf='hasIcons(button.submenuItems)',
-                            [innerHTML]='sanitizeIcon(item.icon)'
+                            [fastHtmlBind]='item.icon'
                         )
                         div([class.ml-3]='hasIcons(button.submenuItems)') {{item.title}}
 
@@ -64,7 +64,7 @@ title-bar(
                 button.btn.btn-secondary.btn-tab-bar(
                     [title]='button.title',
                     (click)='button.click && button.click()',
-                    [innerHTML]='sanitizeIcon(button.icon)',
+                    [fastHtmlBind]='button.icon',
                     ngbDropdownToggle,
                 )
                 div(*ngIf='button.submenu', ngbDropdownMenu)
@@ -75,7 +75,7 @@ title-bar(
                     )
                         .icon-wrapper(
                             *ngIf='hasIcons(button.submenuItems)',
-                            [innerHTML]='sanitizeIcon(item.icon)'
+                            [fastHtmlBind]='item.icon'
                         )
                         div([class.ml-3]='hasIcons(button.submenuItems)') {{item.title}}
 
@@ -83,7 +83,7 @@ title-bar(
                 *ngIf='updatesAvailable',
                 title='Update available - Click to install',
                 (click)='updateApp()',
-                [innerHTML]='sanitizeIcon(updateIcon)'
+                [fastHtmlBind]='updateIcon'
             )
 
         window-controls.background(

terminus-core/src/components/appRoot.component.ts

@@ -1,6 +1,5 @@
 import { Component, Inject, Input, HostListener, HostBinding } from '@angular/core'
 import { trigger, style, animate, transition, state } from '@angular/animations'
-import { DomSanitizer } from '@angular/platform-browser'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 
 import { ElectronService } from '../services/electron.service'
@@ -75,7 +74,6 @@ export class AppRootComponent {
         public hostApp: HostAppService,
         public config: ConfigService,
         public app: AppService,
-        private domSanitizer: DomSanitizer,
         @Inject(ToolbarButtonProvider) private toolbarButtonProviders: ToolbarButtonProvider[],
         log: LogService,
         ngbModal: NgbModal,
@@ -254,10 +252,6 @@ export class AppRootComponent {
         return submenuItems.some(x => !!x.icon)
     }
 
-    sanitizeIcon (icon: string): any {
-        return this.domSanitizer.bypassSecurityTrustHtml(icon || '')
-    }
-
     private getToolbarButtons (aboveZero: boolean): ToolbarButton[] {
         let buttons: ToolbarButton[] = []
         this.config.enabledServices(this.toolbarButtonProviders).forEach(provider => {

terminus-core/src/directives/fastHtmlBind.directive.ts

@@ -0,0 +1,14 @@
+import { Directive, Input, ElementRef, OnChanges } from '@angular/core'
+
+/** @hidden */
+@Directive({
+    selector: '[fastHtmlBind]',
+})
+export class FastHtmlBindDirective implements OnChanges {
+    @Input() fastHtmlBind: string
+    constructor (private el: ElementRef) { }
+
+    ngOnChanges () {
+        this.el.nativeElement.innerHTML = this.fastHtmlBind
+    }
+}

terminus-core/src/index.ts

@@ -21,6 +21,7 @@ import { SplitTabSpannerComponent } from './components/splitTabSpanner.component
 import { WelcomeTabComponent } from './components/welcomeTab.component'
 
 import { AutofocusDirective } from './directives/autofocus.directive'
+import { FastHtmlBindDirective } from './directives/fastHtmlBind.directive'
 
 import { HotkeyProvider } from './api/hotkeyProvider'
 import { ConfigProvider } from './api/configProvider'
@@ -80,6 +81,7 @@ const PROVIDERS = [
         RenameTabModalComponent,
         SafeModeModalComponent,
         AutofocusDirective,
+        FastHtmlBindDirective,
         SplitTabComponent,
         SplitTabSpannerComponent,
         WelcomeTabComponent,