比 vue2 大了几倍
在不使用 CLI, 而是用<script src="vue.global.js">加载的情况下, 是不是会比 vue2 加载慢?
1
bojackhorseman 2020-11-19 23:24:50 +08:00 via iPhone
不算大了吧,你随便加载几张图片就几 m 了
|
2
murmur 2020-11-19 23:25:51 +08:00
肯定不会是直接全部加载啊,template 编译器不要,打包成 release,再来个树抖,少不少
就算直接引用咋了,gzip 后的大小在宽带下也可以接受,当年 12306 直接前端加载几十兆的列车时刻表都干得出来,只要你 cdn 够牛逼 |
3
RickyC OP @bojackhorseman 可是每个页面都要加载这个 500k 的东西
|
5
Jirajine 2020-11-19 23:33:18 +08:00 via Android
还真有人用这种直接引用的方式用?我还以为这种用法只是 vue 用来彰显自己“易上手”呢。
回到你的问题,有缓存的情况下,带宽不会造成太大影响。 |
6
luob 2020-11-19 23:35:04 +08:00
看了一下,
https://unpkg.com/[email protected]/dist/vue.js 85.7kb https://unpkg.com/[email protected]/dist/vue.global.js 111kb 你的 500k 是哪来的? |
9
randyo 2020-11-19 23:42:37 +08:00 via Android
gzip 以后就很小了
|
12
qiaobeier 2020-11-19 23:49:02 +08:00
现代浏览器的渲染是渐进的,如果基础包稍大会拖累之后所有内容的渲染效果。
不过没有对比数据的支撑,我这话其实没有多大的参考价值。 |
13
JerryCha 2020-11-20 00:22:20 +08:00
图片:老子比你大多了
|
14
dahhd 2020-11-20 00:30:49 +08:00 via iPhone
包的大小,和空间复杂度有关系,和时间复杂度 有什么绝对的关系?
|
15
by73 2020-11-20 00:41:27 +08:00 1
不要光看大小啊,楼上的 unpkg 还启用了 br 压缩,完整代码传输只占了 110KB 左右。如果你觉得不满意还能用 production 版,https://unpkg.com/[email protected]/dist/vue.global.prod.js ,大小只有 100KB,br 压缩后传输只有 30KB,这不算大了。。
另外,核心框架其实一般都不算大,对比于业务 /样式这样的动辄数 MB 大小的资源。。 |
16
noe132 2020-11-20 00:42:26 +08:00 1
|
17
Kasumi20 2020-11-20 00:47:16 +08:00
|
18
cmdOptionKana 2020-11-20 00:50:52 +08:00
@RickyC 这些框架的发展,与浏览器的改进、电脑硬件的进步是同时进行的,如果会拖慢浏览器,这些框架就发展不起来(或者会花更多精力去优化)。
至于浏览器为什么不怕被这 500KB 拖慢,那就是硬件发展和浏览器底层优化的问题了。 |
20
autoxbc 2020-11-20 05:26:08 +08:00
不要因为有些网站卡顿就怀疑现代浏览器的性能,是那些网站的代码有问题
对于绝大多数网站,只要是认真写的代码,浏览器性能缩水 2 个数量级也不会卡 |
21
SilentDepth 2020-11-20 08:52:44 +08:00
@RickyC #8 对于现代计算机 /浏览器的性能,500KB 真不是啥问题,上 MB 的都没见卡过
|
22
liberty1900 2020-11-20 08:57:19 +08:00 via Android
楼上用图片对比的过分了,js 加载是会阻断页面渲染的,图片不会,用户观感能一样吗
gzip 和 CDN 都是蹩脚的理由,是只是优化,不能从源头解决问题 直接用 script 便签引用毫无办法 用 cli 会有 tree shaking,如果再做个代码分割体积会小很多 用 nuxt 等框架做服务端渲染也是个办法 |
23
myCupOfTea 2020-11-20 09:14:04 +08:00
@liberty1900 js 也可以做到不阻断页面渲染啊
|
24
gouflv 2020-11-20 09:14:13 +08:00 via iPhone
在 ie 年代的 jq,有多大你造吗
|
25
yaphets666 2020-11-20 09:21:25 +08:00
问题不大.vue3 引入了 tree shaking 技术. 没有用到的模块直接摇落.
|
26
oneend 2020-11-20 09:41:37 +08:00
5G:500kb 都要考虑? 当我是空气啊
|
27
litujin1123 2020-11-20 09:43:12 +08:00
@Jirajine 看一下 php 渲染的 html 页面,不用这样你怎么用?
|
28
love 2020-11-20 09:58:24 +08:00
你直接引用整个当然很大了,还是要事先 cli 编译才能小。
另外 500K 也不算大,我的用 react 的小程序是 791K,只因用了个第三方 UI 框架。 |
29
passerbytiny 2020-11-20 09:59:02 +08:00 via Android
请善用缓存机制,库文件只需要下载一次,不要每进一次页面就下载一次。当然,除了 html,浏览器不会全速加载其他东西,所以 js 还是要尽量压缩,不然 200k 的 js 就可能让人不进首页。
|
30
keepeye 2020-11-20 10:01:42 +08:00
用了 element-ui iview 之类的岂不是更大?纠结这个干啥,该上 cdn 上 cdn 就是了
|
31
Vegetable 2020-11-20 10:06:42 +08:00
讨论质量每况愈下啊。
文件大小上来说,你看这个文件 500k,但是网络传输是压缩过的,只有 111k,同时你没有选对文件,正确的 prod.js 网络传输只有 40k 。 然后是你说的 500k 会不会对浏览器造成负担,这么说也没错,但是这个负担小到基本可以忽,我倒是希望微信开发团队有你这种极客精神。 |
32
vision1900 2020-11-20 10:18:06 +08:00
现在的 Web 前端框架就是 bloated,这点没必要为其辩解,是实实在在的问题
gzip,cdn,tree shaking,代码分割,服务端渲染都是常见的优化方式 |
33
zjsxwc 2020-11-20 10:30:22 +08:00
老项目 vue1.x 传输 27k 实际解压后 75k,
vue2 、3 也都在传输 100k 左右吧。 |
34
JayLin1011 2020-11-20 12:50:16 +08:00
推荐使用 react 和 angular 。
|