diff --git a/nodemon.json b/nodemon.json
index e76cdba1a4..107ae1a754 100644
--- a/nodemon.json
+++ b/nodemon.json
@@ -5,5 +5,5 @@
     "src/index.html"
   ],
   "ext": "js ts json html",
-  "delay": "500"
+  "delay": "50"
 }
diff --git a/src/app/shared/host-window.service.spec.ts b/src/app/shared/host-window.service.spec.ts
index 674d0e1332..41be3211e9 100644
--- a/src/app/shared/host-window.service.spec.ts
+++ b/src/app/shared/host-window.service.spec.ts
@@ -1,9 +1,10 @@
 import { Store } from '@ngrx/store';
+import { cold, hot } from 'jasmine-marbles';
 import { Observable } from 'rxjs/Observable';
 import { AppState } from '../app.reducer';
 import { HostWindowState } from './host-window.reducer';
 
-import { HostWindowService } from './host-window.service';
+import { GridBreakpoint, HostWindowService, WidthCategory } from './host-window.service';
 
 describe('HostWindowService', () => {
   let service: HostWindowService;
@@ -189,4 +190,76 @@ describe('HostWindowService', () => {
     });
   });
 
+  describe('widthCategory', () => {
+    beforeEach(() => {
+      service = new HostWindowService({} as Store<AppState>);
+    });
+
+    it('should call getWithObs to get the current width', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', { a: GridBreakpoint.SM_MIN - 1 }));
+
+      const result = service.widthCategory;
+
+      expect((service as any).getWidthObs).toHaveBeenCalled();
+    });
+
+    it('should return XS if width < SM_MIN', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', { a: GridBreakpoint.SM_MIN - 1 }));
+
+      const result = service.widthCategory;
+
+      const expected = cold('b-', { b: WidthCategory.XS });
+      expect(result).toBeObservable(expected);
+    });
+
+    it('should return SM if SM_MIN <= width < MD_MIN', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', {
+          a: GridBreakpoint.SM_MIN + Math.floor((GridBreakpoint.MD_MIN - GridBreakpoint.SM_MIN) / 2)
+        }));
+
+      const result = service.widthCategory;
+
+      const expected = cold('b-', { b: WidthCategory.SM });
+      expect(result).toBeObservable(expected);
+    });
+
+    it('should return MD if MD_MIN <= width < LG_MIN', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', {
+          a: GridBreakpoint.MD_MIN + Math.floor((GridBreakpoint.LG_MIN - GridBreakpoint.MD_MIN) / 2)
+        }));
+
+      const result = service.widthCategory;
+
+      const expected = cold('b-', { b: WidthCategory.MD });
+      expect(result).toBeObservable(expected);
+    });
+
+    it('should return LG if LG_MIN <= width < XL_MIN', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', {
+          a: GridBreakpoint.LG_MIN + Math.floor((GridBreakpoint.XL_MIN - GridBreakpoint.LG_MIN) / 2)
+        }));
+
+      const result = service.widthCategory;
+
+      const expected = cold('b-', { b: WidthCategory.LG });
+      expect(result).toBeObservable(expected);
+    });
+
+    it('should return XL if width >= XL_MIN', () => {
+      spyOn(service as any, 'getWidthObs').and
+        .returnValue(hot('a-', { a: GridBreakpoint.XL_MIN + 1 }));
+
+      const result = service.widthCategory;
+
+      const expected = cold('b-', { b: WidthCategory.XL });
+      expect(result).toBeObservable(expected);
+    });
+
+  });
+
 });
diff --git a/webpack/webpack.common.js b/webpack/webpack.common.js
index 904e52e0ff..3cbfe5c648 100644
--- a/webpack/webpack.common.js
+++ b/webpack/webpack.common.js
@@ -14,7 +14,7 @@ module.exports = {
     path: root('dist')
   },
   watchOptions: {
-    aggregateTimeout: 500,
+    aggregateTimeout: 50,
   },
   module: {
     rules: [{