[visTypeTimeseries] Reduce page load bundle to under 100kB #95873 (#9…

…7972) * [visTypeTimeseries] Reduce page load bundle to under 100kB #95873 Closes: 95873 * ts-ignore -> ts-expect-error Co-authored-by: Kibana Machine <[email protected]>
elastic · Apr 27, 2021 · 88288c8 · 88288c8
1 parent 088212b
commit 88288c8
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 24 deletions.
diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml
@@ -92,7 +92,7 @@ pageLoadAssetSize:
   visTypeTable: 94934
   visTypeTagcloud: 37575
   visTypeTimelion: 68883
-  visTypeTimeseries: 155203
+  visTypeTimeseries: 55203
   visTypeVega: 153573
   visTypeVislib: 242838
   visTypeXy: 113478

diff --git a/src/plugins/vis_type_timeseries/public/application/index.ts b/src/plugins/vis_type_timeseries/public/application/index.ts
diff --git a/src/plugins/vis_type_timeseries/public/metrics_type.ts b/src/plugins/vis_type_timeseries/public/metrics_type.ts
@@ -8,7 +8,7 @@
 
 import { i18n } from '@kbn/i18n';
 
-import { TSVB_EDITOR_NAME } from './application';
+import { TSVB_EDITOR_NAME } from './application/editor_controller';
 import { PANEL_TYPES } from '../common/panel_types';
 import { isStringTypeIndexPattern } from '../common/index_patterns_utils';
 import { toExpressionAst } from './to_ast';

diff --git a/src/plugins/vis_type_timeseries/public/plugin.ts b/src/plugins/vis_type_timeseries/public/plugin.ts
@@ -6,13 +6,11 @@
  * Side Public License, v 1.
  */
 
-import './application/index.scss';
-
 import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from 'kibana/public';
 import { Plugin as ExpressionsPublicPlugin } from '../../expressions/public';
 import { VisualizationsSetup } from '../../visualizations/public';
 import { VisualizePluginSetup } from '../../visualize/public';
-import { EditorController, TSVB_EDITOR_NAME } from './application';
+import { EditorController, TSVB_EDITOR_NAME } from './application/editor_controller';
 
 import { createMetricsFn } from './metrics_fn';
 import { metricsVisDefinition } from './metrics_type';

diff --git a/src/plugins/vis_type_timeseries/public/request_handler.ts b/src/plugins/vis_type_timeseries/public/request_handler.ts
@@ -8,7 +8,8 @@
 
 import { KibanaContext } from '../../data/public';
 
-import { getTimezone, validateInterval } from './application';
+import { getTimezone } from './application/lib/get_timezone';
+import { validateInterval } from './application/lib/validate_interval';
 import { getUISettings, getDataStart, getCoreStart } from './services';
 import { MAX_BUCKETS_SETTING, ROUTES } from '../common/constants';
 import { TimeseriesVisParams } from './types';

diff --git a/src/plugins/vis_type_timeseries/public/timeseries_vis_renderer.tsx b/src/plugins/vis_type_timeseries/public/timeseries_vis_renderer.tsx
@@ -12,14 +12,16 @@ import { render, unmountComponentAtNode } from 'react-dom';
 
 import { I18nProvider } from '@kbn/i18n/react';
 import { IUiSettingsClient } from 'kibana/public';
-import type { PersistedState } from '../../visualizations/public';
-import { VisualizationContainer } from '../../visualizations/public';
-import { ExpressionRenderDefinition } from '../../expressions/common/expression_renderers';
-import { TimeseriesRenderValue } from './metrics_fn';
+
+import { VisualizationContainer, PersistedState } from '../../visualizations/public';
+
 import { isVisTableData, TimeseriesVisData } from '../common/types';
-import { TimeseriesVisParams } from './types';
 import { getChartsSetup } from './services';
 
+import type { TimeseriesVisParams } from './types';
+import type { ExpressionRenderDefinition } from '../../expressions/common';
+import type { TimeseriesRenderValue } from './metrics_fn';
+
 const TimeseriesVisualization = lazy(
   () => import('./application/components/timeseries_visualization')
 );
@@ -39,6 +41,10 @@ export const getTimeseriesVisRenderer: (deps: {
   name: 'timeseries_vis',
   reuseDomNode: true,
   render: async (domNode, config, handlers) => {
+    // Build optimization. Move app styles from main bundle
+    // @ts-expect-error TS error, cannot find type declaration for scss
+    await import('./application/index.scss');
+
     handlers.onDestroy(() => {
       unmountComponentAtNode(domNode);
     });

diff --git a/src/plugins/vis_type_timeseries/public/to_ast.ts b/src/plugins/vis_type_timeseries/public/to_ast.ts
@@ -7,9 +7,9 @@
  */
 
 import { buildExpression, buildExpressionFunction } from '../../expressions/public';
-import { Vis } from '../../visualizations/public';
-import { TimeseriesExpressionFunctionDefinition } from './metrics_fn';
-import { TimeseriesVisParams } from './types';
+import type { Vis } from '../../visualizations/public';
+import type { TimeseriesExpressionFunctionDefinition } from './metrics_fn';
+import type { TimeseriesVisParams } from './types';
 
 export const toExpressionAst = (vis: Vis<TimeseriesVisParams>) => {
   const timeseries = buildExpressionFunction<TimeseriesExpressionFunctionDefinition>('tsvb', {