Reduce UI resources size. UI resources compression support.

application/src/main/resources/thingsboard.yml

@@ -328,6 +328,13 @@ spring.mvc.cors:
          max-age: "1800"
          allow-credentials: "true"
 
+# spring serve gzip compressed static resources
+spring.resources.chain:
+  gzipped: "true"
+  strategy:
+    content:
+      enabled: "true"
+
 # HSQLDB DAO Configuration
 spring:
   data:

ui/package.json

@@ -15,7 +15,6 @@
   },
   "dependencies": {
     "@flowjs/ng-flow": "^2.7.1",
-    "ace-builds": "1.3.1",
     "angular": "1.5.8",
     "angular-animate": "1.5.8",
     "angular-aria": "1.5.8",
@@ -47,7 +46,7 @@
     "angular-ui-router": "^0.3.1",
     "angular-websocket": "^2.0.1",
     "base64-js": "^1.2.1",
-    "brace": "^0.8.0",
+    "brace": "^0.10.0",
     "canvas-gauges": "^2.0.9",
     "clipboard": "^1.5.15",
     "compass-sass-mixins": "^0.12.7",
@@ -96,6 +95,7 @@
     "babel-loader": "^6.2.5",
     "babel-preset-es2015": "^6.14.0",
     "babel-preset-react": "^6.16.0",
+    "compression-webpack-plugin": "^1.1.11",
     "connect-history-api-fallback": "^1.3.0",
     "copy-webpack-plugin": "^3.0.1",
     "cross-env": "^3.2.4",

ui/src/app/components/json-content.directive.js

@@ -18,8 +18,8 @@ import './json-content.scss';
 import 'brace/ext/language_tools';
 import 'brace/mode/json';
 import 'brace/mode/text';
-import 'ace-builds/src-min-noconflict/snippets/json';
-import 'ace-builds/src-min-noconflict/snippets/text';
+import 'brace/snippets/json';
+import 'brace/snippets/text';
 
 import fixAceEditor from './ace-editor-fix';
 

ui/src/app/components/json-object-edit.directive.js

@@ -17,7 +17,7 @@ import './json-object-edit.scss';
 
 import 'brace/ext/language_tools';
 import 'brace/mode/json';
-import 'ace-builds/src-min-noconflict/snippets/json';
+import 'brace/snippets/json';
 
 import fixAceEditor from './ace-editor-fix';
 

ui/src/app/widget/widget-editor.controller.js

@@ -20,12 +20,11 @@ import 'brace/mode/javascript';
 import 'brace/mode/html';
 import 'brace/mode/css';
 import 'brace/mode/json';
-import 'ace-builds/src-min-noconflict/ace';
-import 'ace-builds/src-min-noconflict/snippets/javascript';
-import 'ace-builds/src-min-noconflict/snippets/text';
-import 'ace-builds/src-min-noconflict/snippets/html';
-import 'ace-builds/src-min-noconflict/snippets/css';
-import 'ace-builds/src-min-noconflict/snippets/json';
+import 'brace/snippets/javascript';
+import 'brace/snippets/text';
+import 'brace/snippets/html';
+import 'brace/snippets/css';
+import 'brace/snippets/json';
 
 /* eslint-disable import/no-unresolved, import/default */
 

ui/webpack.config.prod.js

@@ -18,6 +18,7 @@
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
+const CompressionPlugin = require('compression-webpack-plugin');
 const webpack = require('webpack');
 const path = require('path');
 
@@ -64,6 +65,13 @@ module.exports = {
                 NODE_ENV: JSON.stringify('production'),
             },
         }),
+        new CompressionPlugin({
+            asset: "[path].gz[query]",
+            algorithm: "gzip",
+            test: /\.js$|\.css$|\.svg$|\.ttf$|\.woff$|\.woff2|\.eot$/,
+            threshold: 10240,
+            minRatio: 0.8
+        })
     ],
     node: {
         tls: "empty",