客户端性能

延迟加载代码

简而言之：尽可能多地延迟加载代码。每个人都喜欢响应迅速、UI 灵敏的应用程序，且讨厌加载提示图标。无论用户是在本地还是云端运行 Kibana，也无论其硬件和环境如何，他们都应获得最佳体验。

应用程序的感知速度主要有两个方面：加载时间和对用户操作的响应能力。每当用户访问任何页面时，Kibana 都会加载并引导所有插件。这意味着每个新应用程序都会影响整体的加载性能，因为插件代码是急切加载的，以便初始化插件并向依赖它的插件提供插件 API。

然而，通常并不需要一次性加载和初始化整个插件代码。插件可以在 Kibana 引导时继续加载涵盖 API 功能的代码，但当应用程序页面或管理区域挂载时，按需延迟加载 UI 相关代码。尽可能优先延迟导入 UI 根组件（例如在 mount 处理程序中）。即使这些组件的大小看起来微不足道，它们也可能使用了某些重量级库，这些库也会从初始插件包中移除，从而显著减小其大小。

		import type { Plugin, CoreSetup, AppMountParameters } from '@kbn/core/public';
export class MyPlugin implements Plugin<MyPluginSetup> {
  setup(core: CoreSetup, plugins: SetupDeps) {
    core.application.register({
      id: 'app',
      title: 'My app',
      async mount(params: AppMountParameters) {
        const { mountApp } = await import('./app/mount_app');
        return mountApp(await core.getStartServices(), params);
      },
    });
    plugins.management.sections.section.kibana.registerApp({
      id: 'app',
      title: 'My app',
      order: 1,
      async mount(params) {
        const { mountManagementSection } = await import('./app/mount_management_section');
        return mountManagementSection(coreSetup, params);
      },
    });
    return {
      doSomething() {},
    };
  }
}
		
	

Kibana 平台插件使用 @kbn/optimizer 预构建，并作为包工件进行分发。这意味着我们不再需要在 Kibana 的可分发版本中包含 optimizer。每个插件工件都包含运行该插件所需的所有插件依赖项，除了通过 @kbn/ui-shared-deps-npm 和 @kbn/ui-shared-deps-src 在不同插件包之间共享的一些有状态依赖项外。这意味着插件工件往往比传统平台中的更大。要了解当前插件工件的大小，请运行 @kbn/optimizer 并附带

		node scripts/build_kibana_platform_plugins.js --dist --profile --focus=my_plugin
		
	

并检查插件文件夹中 target 子文件夹下的输出

		ls -lh plugins/my_plugin/target/public/
# output
# an async chunk loaded on demand
... 262K 0.plugin.js
# eagerly loaded chunk
... 50K  my_plugin.plugin.js
		
	

您可能会看到至少一个 js 包 - my_plugin.plugin.js。这是浏览器中 Kibana 在引导期间加载的唯一工件。经验法则是尽可能保持其体积小。您插件中其他延迟加载的部分将作为单独的代码块存在于同一文件夹中，命名为 {number}.myplugin.js。如果您想调查插件包的组成，您需要运行带有 --profile 标志的 @kbn/optimizer 来生成一个 webpack 统计文件。

node scripts/build_kibana_platform_plugins.js --dist --no-examples --profile

许多开源工具允许您分析生成的统计文件

客户端性能

延迟加载代码

了解插件包大小