lazy load React components + VegaParser (elastic#64749)

Author: mshustov

src/plugins/vis_type_vega/public/vega_request_handler.ts

@@ -19,8 +19,6 @@
 
 import { Filter, esQuery, TimeRange, Query } from '../../data/public';
 
-// @ts-ignore
-import { VegaParser } from './data_model/vega_parser';
 // @ts-ignore
 import { SearchCache } from './data_model/search_cache';
 // @ts-ignore
@@ -46,7 +44,12 @@ export function createVegaRequestHandler({
   const { timefilter } = data.query.timefilter;
   const timeCache = new TimeCache(timefilter, 3 * 1000);
 
-  return ({ timeRange, filters, query, visParams }: VegaRequestHandlerParams) => {
+  return async function vegaRequestHandler({
+    timeRange,
+    filters,
+    query,
+    visParams,
+  }: VegaRequestHandlerParams) {
     if (!searchCache) {
       searchCache = new SearchCache(getData().search.__LEGACY.esClient, {
         max: 10,
@@ -58,8 +61,10 @@ export function createVegaRequestHandler({
 
     const esQueryConfigs = esQuery.getEsQueryConfig(uiSettings);
     const filtersDsl = esQuery.buildEsQuery(undefined, query, filters, esQueryConfigs);
+    // @ts-ignore
+    const { VegaParser } = await import('./data_model/vega_parser');
     const vp = new VegaParser(visParams.spec, searchCache, timeCache, filtersDsl, serviceSettings);
 
-    return vp.parseAsync();
+    return await vp.parseAsync();
   };
 }

src/plugins/vis_type_vega/public/vega_visualization.js

@@ -17,8 +17,6 @@
  * under the License.
  */
 import { i18n } from '@kbn/i18n';
-import { VegaView } from './vega_view/vega_view';
-import { VegaMapView } from './vega_view/vega_map_view';
 import { getNotifications, getData, getSavedObjects } from './services';
 
 export const createVegaVisualization = ({ serviceSettings }) =>
@@ -117,8 +115,10 @@ export const createVegaVisualization = ({ serviceSettings }) =>
 
         if (vegaParser.useMap) {
           const services = { toastService: getNotifications().toasts };
+          const { VegaMapView } = await import('./vega_view/vega_map_view');
           this._vegaView = new VegaMapView(vegaViewParams, services);
         } else {
+          const { VegaView } = await import('./vega_view/vega_view');
           this._vegaView = new VegaView(vegaViewParams);
         }
         await this._vegaView.init();