多个preFetchLib加载的包，首次渲染时间会太长的问题？有没有好的解决思路呢？

[luoguoxiong]

import { preFetchLib, bindReactRuntime } from 'hel-micro';
import React from 'react';
import ReactDOM from 'react-dom';
import ReactIs from 'react-is';

bindReactRuntime({ React, ReactDOM, ReactIs });

async function main() {
  // 预加载远程模块 ，例如 hel-antd
  await preFetchLib('hel-antd', { enableDiskCache: true });
  await import('./loadApp');
}

main().catch(console.error);

假设我有多个preFetchLib加载的包，是否都需要在入口引入，这样处理，可能会有首次渲染时间会太长的问题

[fantasticsoul]

可使用 Promise.all 执行并行的 PreFetch

[luoguoxiong]

@fantasticsoul 我指的是，这种引入方式可能会牺牲部分首屏渲染性能。比如我在某个页面使用了hel-page,而且这个组件，是单一页面使用，放在入口，好像不太好。可能需要提供按需加载的方式引入。

[fantasticsoul]

针对首屏，可以后台拉元数据预埋到类似的 window.__HEL_META__ ，然后sdk改为：

await preFetchLib('hel-tpl-remote-vue-comps', {
  async getSubAppAndItsVersionFn(params) {
    if( window.__HEL_META__ )return  window.__HEL_META__ ;
    return params.innerRequest(); // 走原来的内置请求
  },
});

[fantasticsoul]

可参考文档说明：https://tnfe.github.io/hel/docs/api/hel-micro/prefetch-lib#%E9%87%8D%E7%BD%AE%E5%85%83%E6%95%B0%E6%8D%AE%E6%8E%A5%E5%8F%A3

[fantasticsoul]

按需加载可以使用 hel-micro-react https://tnfe.github.io/hel/docs/api/hel-micro-react/useRemoteComp

[fantasticsoul]

如果是普通模块，直接用的时候再调 preFetchLib 也是可以的

[fantasticsoul]

close issue