diff --git a/shared/src/components/svg/keyboard/svg-keyboard.component.ts b/shared/src/components/svg/keyboard/svg-keyboard.component.ts
index 1ff477da..f23a8b01 100644
--- a/shared/src/components/svg/keyboard/svg-keyboard.component.ts
+++ b/shared/src/components/svg/keyboard/svg-keyboard.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output, ChangeDetectionStrategy } from '@angular/core';
 
 import { Module } from '../../../config-serializer/config-items/Module';
 import { SvgModule } from '../module';
@@ -6,7 +6,8 @@ import { SvgModule } from '../module';
 @Component({
     selector: 'svg-keyboard',
     templateUrl: './svg-keyboard.component.html',
-    styleUrls: ['./svg-keyboard.component.scss']
+    styleUrls: ['./svg-keyboard.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgKeyboardComponent implements OnInit {
     @Input() moduleConfig: Module[];
diff --git a/shared/src/components/svg/keys/svg-icon-text-key/svg-icon-text-key.component.ts b/shared/src/components/svg/keys/svg-icon-text-key/svg-icon-text-key.component.ts
index 12b296f9..e03e81b1 100644
--- a/shared/src/components/svg/keys/svg-icon-text-key/svg-icon-text-key.component.ts
+++ b/shared/src/components/svg/keys/svg-icon-text-key/svg-icon-text-key.component.ts
@@ -1,8 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 @Component({
     selector: 'g[svg-icon-text-key]',
-    templateUrl: './svg-icon-text-key.component.html'
+    templateUrl: './svg-icon-text-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgIconTextKeyComponent implements OnInit {
     @Input() width: number;
diff --git a/shared/src/components/svg/keys/svg-keystroke-key/svg-keystroke-key.component.ts b/shared/src/components/svg/keys/svg-keystroke-key/svg-keystroke-key.component.ts
index 5a406017..36282e34 100644
--- a/shared/src/components/svg/keys/svg-keystroke-key/svg-keystroke-key.component.ts
+++ b/shared/src/components/svg/keys/svg-keystroke-key/svg-keystroke-key.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnChanges, OnInit } from '@angular/core';
+import { Component, Input, OnChanges, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 import { KeystrokeAction } from '../../../../config-serializer/config-items/key-action';
 import { KeyModifiers } from '../../../../config-serializer/config-items/KeyModifiers';
@@ -27,7 +27,8 @@ enum Modifiers {
 @Component({
     selector: 'g[svg-keystroke-key]',
     templateUrl: './svg-keystroke-key.component.html',
-    styleUrls: ['./svg-keystroke-key.component.scss']
+    styleUrls: ['./svg-keystroke-key.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgKeystrokeKeyComponent implements OnInit, OnChanges {
     @Input() height: number;
diff --git a/shared/src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.ts b/shared/src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.ts
index 577ca449..96e6f440 100644
--- a/shared/src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.ts
+++ b/shared/src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 import { MapperService } from '../../../../services/mapper.service';
 
 @Component({
     selector: 'g[svg-mouse-click-key]',
-    templateUrl: './svg-mouse-click-key.html'
+    templateUrl: './svg-mouse-click-key.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgMouseClickKeyComponent implements OnInit {
     @Input() button: string;
diff --git a/shared/src/components/svg/keys/svg-mouse-key/svg-mouse-key.ts b/shared/src/components/svg/keys/svg-mouse-key/svg-mouse-key.ts
index 61573e77..a0a42678 100644
--- a/shared/src/components/svg/keys/svg-mouse-key/svg-mouse-key.ts
+++ b/shared/src/components/svg/keys/svg-mouse-key/svg-mouse-key.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnChanges } from '@angular/core';
+import { Component, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
 
 import { MouseAction, MouseActionParam } from '../../../../config-serializer/config-items/key-action';
 
 @Component({
     selector: 'g[svg-mouse-key]',
-    templateUrl: './svg-mouse-key.html'
+    templateUrl: './svg-mouse-key.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgMouseKeyComponent implements OnChanges {
     @Input() mouseAction: MouseAction;
diff --git a/shared/src/components/svg/keys/svg-mouse-move-key/svg-mouse-move-key.ts b/shared/src/components/svg/keys/svg-mouse-move-key/svg-mouse-move-key.ts
index 4ba6bddc..dcfb4864 100644
--- a/shared/src/components/svg/keys/svg-mouse-move-key/svg-mouse-move-key.ts
+++ b/shared/src/components/svg/keys/svg-mouse-move-key/svg-mouse-move-key.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnChanges } from '@angular/core';
+import { Component, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
 
 import { MapperService } from '../../../../services/mapper.service';
 
 @Component({
     selector: 'g[svg-mouse-move-key]',
-    templateUrl: './svg-mouse-move-key.html'
+    templateUrl: './svg-mouse-move-key.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgMouseMoveKeyComponent implements OnChanges {
     @Input() direction: string;
diff --git a/shared/src/components/svg/keys/svg-mouse-scroll-key/svg-mouse-scroll-key.ts b/shared/src/components/svg/keys/svg-mouse-scroll-key/svg-mouse-scroll-key.ts
index 6db331b3..f5f15672 100644
--- a/shared/src/components/svg/keys/svg-mouse-scroll-key/svg-mouse-scroll-key.ts
+++ b/shared/src/components/svg/keys/svg-mouse-scroll-key/svg-mouse-scroll-key.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnChanges } from '@angular/core';
+import { Component, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
 
 import { MapperService } from '../../../../services/mapper.service';
 
 @Component({
     selector: 'g[svg-mouse-scroll-key]',
-    templateUrl: './svg-mouse-scroll-key.html'
+    templateUrl: './svg-mouse-scroll-key.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgMouseScrollKeyComponent implements OnChanges {
     @Input() direction: string;
diff --git a/shared/src/components/svg/keys/svg-mouse-speed-key/svg-mouse-speed-key.ts b/shared/src/components/svg/keys/svg-mouse-speed-key/svg-mouse-speed-key.ts
index e3dcd0f4..659bcd35 100644
--- a/shared/src/components/svg/keys/svg-mouse-speed-key/svg-mouse-speed-key.ts
+++ b/shared/src/components/svg/keys/svg-mouse-speed-key/svg-mouse-speed-key.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnChanges } from '@angular/core';
+import { Component, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
 
 import { MapperService } from '../../../../services/mapper.service';
 
 @Component({
     selector: 'g[svg-mouse-speed-key]',
-    templateUrl: './svg-mouse-speed-key.html'
+    templateUrl: './svg-mouse-speed-key.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgMouseSpeedKeyComponent implements OnChanges {
     @Input() plus: boolean;
diff --git a/shared/src/components/svg/keys/svg-one-line-text-key/svg-one-line-text-key.component.ts b/shared/src/components/svg/keys/svg-one-line-text-key/svg-one-line-text-key.component.ts
index 9ae37515..5b21c003 100644
--- a/shared/src/components/svg/keys/svg-one-line-text-key/svg-one-line-text-key.component.ts
+++ b/shared/src/components/svg/keys/svg-one-line-text-key/svg-one-line-text-key.component.ts
@@ -1,8 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 @Component({
     selector: 'g[svg-one-line-text-key]',
-    templateUrl: './svg-one-line-text-key.component.html'
+    templateUrl: './svg-one-line-text-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgOneLineTextKeyComponent implements OnInit {
     @Input() height: number;
diff --git a/shared/src/components/svg/keys/svg-single-icon-key/svg-single-icon-key.component.ts b/shared/src/components/svg/keys/svg-single-icon-key/svg-single-icon-key.component.ts
index 0baa735b..0fc31baf 100644
--- a/shared/src/components/svg/keys/svg-single-icon-key/svg-single-icon-key.component.ts
+++ b/shared/src/components/svg/keys/svg-single-icon-key/svg-single-icon-key.component.ts
@@ -1,8 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 @Component({
     selector: 'g[svg-single-icon-key]',
-    templateUrl: './svg-single-icon-key.component.html'
+    templateUrl: './svg-single-icon-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgSingleIconKeyComponent implements OnInit {
     @Input() width: number;
diff --git a/shared/src/components/svg/keys/svg-switch-keymap-key/svg-switch-keymap-key.component.ts b/shared/src/components/svg/keys/svg-switch-keymap-key/svg-switch-keymap-key.component.ts
index 994eff59..438cf6cb 100644
--- a/shared/src/components/svg/keys/svg-switch-keymap-key/svg-switch-keymap-key.component.ts
+++ b/shared/src/components/svg/keys/svg-switch-keymap-key/svg-switch-keymap-key.component.ts
@@ -1,10 +1,11 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 import { MapperService } from '../../../../services/mapper.service';
 
 @Component({
     selector: 'g[svg-switch-keymap-key]',
-    templateUrl: './svg-switch-keymap-key.component.html'
+    templateUrl: './svg-switch-keymap-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgSwitchKeymapKeyComponent implements OnInit {
     @Input() width: number;
diff --git a/shared/src/components/svg/keys/svg-text-icon-key/svg-text-icon-key.component.ts b/shared/src/components/svg/keys/svg-text-icon-key/svg-text-icon-key.component.ts
index dac5b0c8..0da90100 100644
--- a/shared/src/components/svg/keys/svg-text-icon-key/svg-text-icon-key.component.ts
+++ b/shared/src/components/svg/keys/svg-text-icon-key/svg-text-icon-key.component.ts
@@ -1,8 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 @Component({
     selector: 'g[svg-text-icon-key]',
-    templateUrl: './svg-text-icon-key.component.html'
+    templateUrl: './svg-text-icon-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgTextIconKeyComponent implements OnInit {
     @Input() width: number;
diff --git a/shared/src/components/svg/keys/svg-two-line-text-key/svg-two-line-text-key.component.ts b/shared/src/components/svg/keys/svg-two-line-text-key/svg-two-line-text-key.component.ts
index 7a21a4fe..4083be85 100644
--- a/shared/src/components/svg/keys/svg-two-line-text-key/svg-two-line-text-key.component.ts
+++ b/shared/src/components/svg/keys/svg-two-line-text-key/svg-two-line-text-key.component.ts
@@ -1,8 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
 
 @Component({
     selector: 'g[svg-two-line-text-key]',
-    templateUrl: './svg-two-line-text-key.component.html'
+    templateUrl: './svg-two-line-text-key.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgTwoLineTextKeyComponent implements OnInit {
     @Input() height: number;
diff --git a/shared/src/components/svg/module/svg-module.component.ts b/shared/src/components/svg/module/svg-module.component.ts
index 7880d01c..d43df42a 100644
--- a/shared/src/components/svg/module/svg-module.component.ts
+++ b/shared/src/components/svg/module/svg-module.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, Input, Output, ChangeDetectionStrategy } from '@angular/core';
 
 import { KeyAction } from '../../../config-serializer/config-items/key-action';
 
@@ -7,7 +7,8 @@ import { SvgKeyboardKey } from '../keys';
 @Component({
     selector: 'g[svg-module]',
     templateUrl: './svg-module.component.html',
-    styleUrls: ['./svg-module.component.scss']
+    styleUrls: ['./svg-module.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SvgModuleComponent {
     @Input() coverages: any[];