diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js b/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js
index 7075e86eb56bf..9fdb8ccc919b7 100644
--- a/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js
+++ b/src/plugins/vis_type_timeseries/public/application/components/vis_editor.js
@@ -240,3 +240,7 @@ VisEditor.propTypes = {
timeRange: PropTypes.object,
appState: PropTypes.object,
};
+
+// default export required for React.Lazy
+// eslint-disable-next-line import/no-default-export
+export { VisEditor as default };
diff --git a/src/plugins/vis_type_timeseries/public/application/components/vis_editor_lazy.tsx b/src/plugins/vis_type_timeseries/public/application/components/vis_editor_lazy.tsx
new file mode 100644
index 0000000000000..d81bd95d8d771
--- /dev/null
+++ b/src/plugins/vis_type_timeseries/public/application/components/vis_editor_lazy.tsx
@@ -0,0 +1,30 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React, { lazy, Suspense } from 'react';
+import { EuiLoadingSpinner } from '@elastic/eui';
+
+// @ts-ignore
+const VisEditorComponent = lazy(() => import('./vis_editor'));
+
+export const VisEditor = (props: any) => (
+ }>
+
+
+);
diff --git a/src/plugins/vis_type_timeseries/public/application/editor_controller.js b/src/plugins/vis_type_timeseries/public/application/editor_controller.js
index af50d3a06d1fc..f21b5f947bca7 100644
--- a/src/plugins/vis_type_timeseries/public/application/editor_controller.js
+++ b/src/plugins/vis_type_timeseries/public/application/editor_controller.js
@@ -21,7 +21,7 @@ import React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import { fetchIndexPatternFields } from './lib/fetch_fields';
import { getSavedObjectsClient, getUISettings, getI18n } from '../services';
-import { VisEditor } from './components/vis_editor';
+import { VisEditor } from './components/vis_editor_lazy';
export class EditorController {
constructor(el, vis, eventEmitter, embeddableHandler) {
diff --git a/src/plugins/vis_type_timeseries/public/metrics_fn.ts b/src/plugins/vis_type_timeseries/public/metrics_fn.ts
index 008b13cce6565..b573225feaab1 100644
--- a/src/plugins/vis_type_timeseries/public/metrics_fn.ts
+++ b/src/plugins/vis_type_timeseries/public/metrics_fn.ts
@@ -20,7 +20,6 @@
import { get } from 'lodash';
import { i18n } from '@kbn/i18n';
import { ExpressionFunctionDefinition, KibanaContext, Render } from '../../expressions/public';
-import { PersistedState } from '../../visualizations/public';
// @ts-ignore
import { metricsRequestHandler } from './request_handler';
@@ -76,6 +75,7 @@ export const createMetricsFn = (): ExpressionFunctionDefinition<
const params = JSON.parse(args.params);
const uiStateParams = JSON.parse(args.uiState);
const savedObjectId = args.savedObjectId;
+ const { PersistedState } = await import('../../visualizations/public');
const uiState = new PersistedState(uiStateParams);
const response = await metricsRequestHandler({
diff --git a/src/plugins/vis_type_timeseries/public/metrics_type.ts b/src/plugins/vis_type_timeseries/public/metrics_type.ts
index c525ce7fa0b3b..2b0734ceb4d4d 100644
--- a/src/plugins/vis_type_timeseries/public/metrics_type.ts
+++ b/src/plugins/vis_type_timeseries/public/metrics_type.ts
@@ -25,6 +25,7 @@ import { EditorController } from './application';
// @ts-ignore
import { PANEL_TYPES } from '../common/panel_types';
import { defaultFeedbackMessage } from '../../kibana_utils/public';
+import { VisEditor } from './application/components/vis_editor_lazy';
export const metricsVisDefinition = {
name: 'metrics',
@@ -69,7 +70,7 @@ export const metricsVisDefinition = {
show_legend: 1,
show_grid: 1,
},
- component: require('./application/components/vis_editor').VisEditor,
+ component: VisEditor,
},
editor: EditorController,
options: {