vite + vue3 项目如何提升加载速度,及删除不必要的加载项

99 天前
 scienhub

我们项目前端是用的 vite + vue3, 但是发现首页加载相对比较慢的,而且加载了很多其他页面需要,但是首页不需要的 js 文件。

请问:

  1. 如何提升加载速度,让 js 等文件的加载不阻塞首页显示呢?
  2. 如何只加载必须的文件?

图片我们都已经做了 lazy-loading, 这里想请问 js 和 css 文件如何只加载必须的文件,以及尽量让加载不阻塞页面渲染。

我们测试服务器的地址是: https://beta.scienhub.com, bundle visualizer: https://beta.scienhub.com/stats.

其中像是 monaco-editormathajax 都是和首页毫无关系的文件,但是仍然在首页加载项里。

2132 次点击
所在节点    Vue.js
22 条回复
scienhub
98 天前
@Charrlles @Charrlles 这是我们 router 的代码截图,除了上面的一些是 import 的,下面的 router 中每个路由都是 dynamic import 的

![]( https://imgur.com/8PzNFl5.jpg)
scienhub
98 天前
@Charrlles 破案了,就是最上面几个 import ,改为 dynamic import 就解决了。
十分感谢!!

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1062060

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX