NGV：插件

在本集中，我们将了解 NGV（我们的现代 3D 查看器框架）的插件方法。这是 NGV 系列的一部分。

针对开发者

一种方法是通过“只需单击即可启用”解决方案来针对非开发人员最终用户。缺点是您需要编写和维护大量额外的代码、文档，这使得它既耗时又僵化。
因此，我们以开发人员为目标，专注于让他们轻松使用。实际上有很多关于插件和可重用代码的技术可供我们利用：git、ES 模块、docker...
另一项重大简化是没有外部插件：要扩展软件，用户应该分叉该项目并构建它。

可维护性/可重用性

插件非常适合可维护的解决方案。使用插件时，您被迫思考什么是核心，什么不是；什么应该是可扩展或可替换的。您需要引入抽象、接口，这使得代码更加孤立且更易于理解。此外，您还可以编写文档和说明来帮助核心开发人员之外的人员理解您的 API：这对每个人来说都变得更加容易。

举个例子，我们创建了插件 ngv-plugin-cesium-widget 来将低级 Cesium 代码与应用程序代码隔离。我们计划拥有数十个应用程序：在插件中使用通用代码使我们能够在应用程序之间共享代码和概念。该插件是通用的，我们公开了用于配置它的接口：该插件可以处理任何配置，它是面向未来的。

@customElement('ngv-plugin-cesium-widget')
export class NgvPluginCesiumWidget extends LitElement {
  public viewer: CesiumWidget;

  @property({type: Object})
  cesiumContext: IngvCesiumContext;

  @property({type: Object})
  modelCallback: (name: string, model: Model) => void;

扩展/定制

通过插件系统，用户可以超越配置。该解决方案可以定制甚至扩展。

例如，所有地理空间应用程序都有一个搜索栏，但没有一个具有相同的功能：不同的后端、不同的格式、不同的功能。

搜索插件可以附带预定义的提供程序（例如：OpenstreetMap Nominatim），并允许您提供自己的提供程序（例如：Pelias、Photon，...）。

这些提供程序独立于该应用程序，可以轻松共享或向上游贡献。

此外，搜索插件可以完全替换为其他实现，只要它遵循底层接口即可。

    for (const pc of descr.config.providers) {
      const initialize = providerInitializers[pc.name];
      if (!initialize) {
        console.error("could not find provider", pc.name, "skipping it");
        continue;
      }
      const provider = initialize(pc.config);
      this.providers.push(provider);
    }

    this.autocomplete = new Autocomplete(this.autocompleteRef.value, {

      search: this.search.bind(this),
      onSubmit: this.onSubmit.bind(this),
      renderResult: this.renderResult.bind(this),
      getResultValue: this.getResultValue.bind(this),
    });

标准

与“插件”的概念非常接近的是“模块”的概念。事实上，Ecmascript 模块是我们在 NGV 框架内部“打包”并提供插件的技术方式。

类似地，Web 组件是允许我们将 UI 插件暴露给 DOM 的技术标准。

我们还可以将 git 视为允许我们的插件策略的基本工具，通过授权用户分叉、适应、贡献。

结论

我们对插件问题的解决方案是一个依赖标准的架构，利用开发人员的专业知识和生态系统，它允许更容易理解、隔离和更易于维护的代码。

你设计过插件系统吗？或者你已经开始思考这个问题了吗？请在评论中告诉我您的反馈。

以上是NGV：插件的详细内容。更多信息请关注PHP中文网其他相关文章！