你们真的可以忍受 webpack 要编译 2-5 秒吗? - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
请不要在回答技术问题时复制粘贴 AI 生成的内容
hellowes
V2EX    程序员

你们真的可以忍受 webpack 要编译 2-5 秒吗?

  •  
     
  •   hellowes 2019-01-01 14:06:37 +08:00 18552 次点击
    这是一个创建于 2543 天前的主题,其中的信息可能已经有所发展或是发生改变。

    最近开发前端,写到中途发现编译速度越来越慢,用的是 vue-cli。后面受不了了,直接用 JQuery 重写了一遍,大家 webpack 一般速度如何

    第 1 条附言    2019-01-01 19:22:49 +08:00
    我觉得 Java 那些很慢完全能够理解,因为他编译成 class 也需要时间。但是 Javascript 感觉这点就很不好,要调一个 BUG 写几处等 2S,这样算下来效率极低,脑子存储的信息被等待干扰的严重,头疼,parcel 也解决不了这个问题
    第 2 条附言    2019-01-02 09:19:45 +08:00
    备注一下,我是用 JQuery+Vue-cdn 来另外写一个项目的,其实之前这种不带编译的方式写起来快很多,最近突发奇想换成编译的,但是大幅度降低了开发效率。无意黑 Vue,只是对 Webpack 编译速度不太满意
    第 3 条附言    2019-01-02 11:01:45 +08:00
    各位,我不是说 build,是说实时编辑之后 webpack 进行编译(然后去 chrome 那里调界面)。因为脚本我的理解,应该就是免编译即使改即使出来的,但是现在感觉越来越重了,哪怕我改个变量也要等半天,毕竟 js 是动态的,很多东西都是未知的
    136 条回复    2020-04-26 16:45:36 +08:00
    1  2  
    importcode
        1
    importcode  
       2019-01-01 14:51:02 +08:00   2
    很多都是(es6,stylus,less,sass,pug) , 是需要编译的 , 速度真的不敢恭维 , 可以尝试使用多线程 happypack 插件缓解一下 , 或者换一个编译工具 可是还是比较慢
    hellowes
        2
    hellowes  
    OP
       2019-01-01 15:02:05 +08:00
    @importcode 我感觉开发效率真的变慢了很多,以前写完直接 debugger 就可以了,现在要写一句等两秒再去调试,感觉脑子一直被阻塞了很久。现在用 JQ 开发,那叫一个精神气爽
    codermagefox
        3
    codermagefox  
       2019-01-01 15:05:26 +08:00
    又是自己用的方法有问题怪工具的。
    我以前改一次还编译二十多秒呢,因为我那个时候不知道怎么优化 webpack。
    不然找找自己的原因先?
    azh7138m
        4
    azh7138m  
       2019-01-01 15:07:42 +08:00 via Android
    2 到 5s,这个是觉得慢吗。。。。我觉得很快了啊。。。
    importcode
        5
    importcode  
       2019-01-01 15:09:32 +08:00   1
    @hellowes #2 恩 毕竟要编译 , 以前是直接写就运行了 现在先把环境弄一下 编译一下 , 不过还是有些好处 自动刷新 , 还有一些新的语言特性之类的可以使用吧 , 难两全
    yhxx
        6
    yhxx  
       2019-01-01 15:10:25 +08:00
    你是说每保存一次都要重新编译 2-5s ?
    遇到这种问题不应该是优化编译速度吗,居然解决的办法是用 jQuery 重写?

    我的项目编译时间一般都在 0.2 秒以内
    VDimos
        7
    VDimos  
       2019-01-01 15:11:12 +08:00 via Android
    babel 已经有人用 rust 重写了,webpack 估计也快了
    ibegyourpardon
        8
    ibegyourpardon  
       2019-01-01 15:11:16 +08:00   1
    可以。

    人总是要休息下的,这宝贵的几秒钟很重要。
    ericls
        9
    ericls  
       2019-01-01 15:14:45 +08:00 via iPhone
    我 80 秒……
    hellowes
        10
    hellowes  
    OP
       2019-01-01 15:17:24 +08:00
    @codermagefox 我也尝试去优化 webpack,把 vue-cli 给 eject 出来,加了 dll、happypack、把 sourcemap 改成 cheap-inline-source-map(但是这样就无法 debugger 了,chrome dev 会错位!),然鹅还是要 2s。
    一开始我也是 20s+,但是目前调优到 2s 之内。说实话 2s 真的有点慢了,我的文件有 8k+行,而且现在 cheap-inline-source-map 的确可以加快速度,但是无法 debugger。感觉这样很打击编程热情的,如果工具一点问题也没有,我想也不会有 grunt->gulp->webpack 的演变了
    hellowes
        11
    hellowes  
    OP
       2019-01-01 15:17:47 +08:00
    @ericls 天啊,这个很 6 啊老哥,优化优化
    hellowes
        12
    hellowes  
    OP
       2019-01-01 15:18:39 +08:00
    @yhxx jQuery+vue cdn 的方式,感觉比编译快很多,而且打包压缩什么的都很快,感觉符合目前需求
    zmj1316
        13
    zmj1316  
       2019-01-01 15:23:19 +08:00   1
    2-5 秒,写 C++的想都不敢想,一不小心改个头文件就十几分钟起步了,按编译之前都要多想想才下手
    fe619742721
        14
    fe619742721  
       2019-01-01 15:27:42 +08:00 via iPhone   1
    8000 行热编译就 2 秒多了么,我们前端项目保守估计 25 万行代码了,只要起来了,热编译都很快啊。。我们用的还是 webpack1 好像,一直没升级,我看也就做过你说的这些优化,不过起项目是真慢,run dev 至少 1 分钟起
    Ley
        15
    Ley  
       2019-01-01 15:28:33 +08:00 via Android
    100 多秒的路过…
    des
        16
    des  
       2019-01-01 15:33:30 +08:00 via Android
    java 和 c++ 笑了
    duan602728596
        17
    duan602728596  
       2019-01-01 15:38:29 +08:00 via iPhone   1
    c,c++,go,java 还需要编译呢,直接都淘汰了不用了?
    loveCoding
        18
    loveCoding  
       2019-01-01 15:40:06 +08:00
    java 一分钟是基操....
    zenio
        19
    zenio  
       2019-01-01 15:45:22 +08:00 via Android
    你考虑过编译型语言的感受吗?
    icaca
        20
    icaca  
       2019-01-01 15:47:44 +08:00
    休息休息也挺好
    Biwood
        21
    Biwood  
       2019-01-01 15:48:29 +08:00 via Android
    如果是构建的时候 2-5 秒那太幸运了,保存的时候这么慢应该是配置问题,还有优化空间吧
    catch
        22
    catch  
       2019-01-01 15:51:10 +08:00 via iPhone
    你的时间非常值钱?
    murmur
        23
    murmur  
       2019-01-01 15:52:22 +08:00   1
    hot reload 这个速度不慢了吧
    rannnn
        24
    rannnn  
       2019-01-01 15:53:41 +08:00
    启动将近 5 分钟,每次保存 100 秒以上
    max-old-space-size 要开到 8g 不然 webpack 都编译不完。。。
    GeruzoniAnsasu
        25
    GeruzoniAnsasu  
       2019-01-01 15:54:43 +08:00   2
    你考虑过 C++的感受吗
    修一行代码过一次 CI 要半小时

    资深老哥说这项目最开初过一次 CI 要两个小时,已经做了很多努力了
    icanfork
        26
    icanfork  
       2019-01-01 16:00:27 +08:00 via iPone
    prod build 日常 120s+
    lihongjie0209
        27
    lihongjie0209  
       2019-01-01 16:17:58 +08:00   1
    说实话超过 1s 思维就开始飘了, 忘记在哪个演讲上看看到的
    imbushuo
        28
    imbushuo  
       2019-01-01 16:24:56 +08:00 via iPhone   2
    这有啥呢,我编译一次 UEFI 15-20 分钟,所以我电脑上有猫和老鼠全集,手机上有 SIF,编译一次清完 LP,然后调试,然后继续打 SIF 或者看猫和老鼠(
    ivechan
        29
    ivechan  
       2019-01-01 16:27:19 +08:00
    居然这么快。。。
    Tankpt
        30
    Tankpt  
       2019-01-01 16:56:39 +08:00 via iPhone
    如果是 build 很快了

    如果是 rebuild 说明你配置的有问题
    TwoDays91
        31
    TwoDays91  
       2019-01-01 17:12:55 +08:00 via iPhone
    目前我们的热编译也是需要 2 到 5 秒,经常坐在那等刷新。无奈
    momocraft
        32
    momocraft  
       2019-01-01 17:22:04 +08:00
    不能忍 (但也得 cra eject 後自己改置).

    目前的做法是 ui 用 mock data 少代量, 算速度可接受
    dingyaguang117
        33
    dingyaguang117  
       2019-01-01 17:39:49 +08:00
    目前 build 8 秒, 热更新 4-5s, 已经去掉了各种 ugly,之前要翻倍
    fanyingmao
        34
    fanyingmao  
       2019-01-01 17:46:04 +08:00 via Android
    2 到 5 秒也不错了,之前安卓开发才真慢。
    huclengyue
        35
    huclengyue  
       2019-01-01 17:46:39 +08:00 via Android
    天啊,安卓开发不敢想啊
    rrfeng
        36
    rrfeng  
       2019-01-01 17:48:28 +08:00
    热更新这么久吗? build prod 无所谓的吧
    ZeoKarl
        37
    ZeoKarl  
       2019-01-01 17:48:44 +08:00 via iPhone
    编译型语言表示情绪稳定
    fish267
        38
    fish267  
       2019-01-01 17:50:29 +08:00
    Java 项目, 每次 build && deploy, 要 3 分钟.
    刚好够上个厕所放个水, 回来后顺便打杯水. 哈哈哈

    说实话我是忍受不了, 和前端项目相比, 太慢了!!
    zlgodpig
        39
    zlgodpig  
       2019-01-01 17:57:35 +08:00   2
    两个项目给你参考下
    1. 后台管理系统,200+页面,之前是 8s +, 换个高配的电脑,直接快了 1 倍。升级 webpack 4,变成差不多 2~3s,然后还可以把 antd react 等比较大的库 external 出去,或者用 dll plugin,估计很快就好了。(暂时没去折腾。
    2. mobile 端的项目,快 100 个页面,没感受不到 rebuild 的时间,按下保存后,立刻就好了。


    总结下来,要不有钱,要不有技术。
    RockOrRoll
        40
    RockOrRoll  
       2019-01-01 18:20:37 +08:00 via Android
    android …………………
    flowfire
        41
    flowfire  
       2019-01-01 18:21:50 +08:00
    angular 表示………… 2 秒已经很快了
    Hconk
        42
    Hconk  
       2019-01-01 18:24:16 +08:00 via Android
    c++表示我们按小时计算^
    dumbunny
        43
    dumbunny  
       2019-01-01 18:28:43 +08:00 via Android
    二次开发一个臃肿的祖传项目没次要编译 10 分钟之久
    fcten
        44
    fcten  
       2019-01-01 18:32:46 +08:00
    2-5 秒真是光速……
    Android2MCU
        45
    Android2MCU  
       2019-01-01 18:41:51 +08:00 via iPhone
    5 秒约等于没有,想想我们 build Android 都是论小时的,是不是应该觉得想死了( ̄(工) ̄)
    lsido
        46
    lsido  
       2019-01-01 18:43:24 +08:00 via iPhone
    哈哈哈,随便导两个包以后编译都要 10 秒了
    lixile
        47
    lixile  
       2019-01-01 19:20:03 +08:00
    之前折腾的时候 半个小时的我。。哪里哭去
    janxin
        48
    janxin  
       2019-01-01 19:20:52 +08:00
    你这速度不是挺快的么?
    我一个 build 几十秒都是正常操作
    sagaxu
        49
    sagaxu  
       2019-01-01 19:31:16 +08:00 via Android
    我也用 vue,但是不需要编译
    karnaugh
        50
    karnaugh  
       2019-01-01 19:34:14 +08:00
    2s 你都等不了。。。那 Android 开发注定与你无缘了。。。(滑稽)
    q2577
        51
    q2577  
       2019-01-01 19:51:19 +08:00
    养成习惯把大脑当成检查器, 这样练习久了, 使用文本编辑器就可以写代码了.
    fyibmsd
        52
    fyibmsd  
       2019-01-01 19:57:35 +08:00 via iPhone
    平均编译 90 秒了解一下
    koalli
        53
    koalli  
       2019-01-01 20:11:33 +08:00
    Android Studio 了解一下?
    klesh
        54
    klesh  
       2019-01-01 20:19:20 +08:00 via Android
    windows?
    hellowes
        55
    hellowes  
    OP
       2019-01-01 20:22:58 +08:00
    @klesh 和 windows 没关系我觉得,三端都高过了
    jingyulong
        56
    jingyulong  
       2019-01-01 20:30:38 +08:00 via iPhone
    一般这个时间我用来看下 v 站帖子
    jorneyr
        57
    jorneyr  
       2019-01-01 20:38:40 +08:00
    5 个多页面的 vue-cli 2 工程, 修改一次编译需要 5s 左右, 升级到 vue-cli 3 后只需要 1s-2s, 感觉很快了.
    LokiSharp
        58
    LokiSharp  
       2019-01-01 20:46:31 +08:00
    什么? Vue 也要编译了???
    kernel
        59
    kernel  
       2019-01-01 20:56:49 +08:00 via Android
    很明显是 webpack 没用对。 只有第一次慢,后面增量编译,只编译保存的文件,应该是瞬间完成的。
    youxiachai
        60
    youxiachai  
       2019-01-01 20:59:56 +08:00 via iPad
    我 android 编译一次几分钟,zhao shui qu
    vinceeema
        61
    vinceeema  
       2019-01-01 21:03:25 +08:00
    写过 Java 的基本都能理解,JS 编译其实已经光速般的快了。
    虽说 JS 是动态,实际情况,大多框架都基于 ES6 需要 Babel 编译处理兼容性。随着项目变大和各种框架混用,几秒到几十秒的编译时间真的是很快了。如果 webpack tasks 优化的好,每次不重新 copy,处理 css 等其他文件,速度应该会跟快。好的优化能让几十秒的编译+pack 时间缩短到十几秒。
    你这个几秒都等不了,心态需要调整下,写的时候尽量一次写对,别靠乱试然后报错再解决问题。
    zlhsvc
        62
    zlhsvc  
       2019-01-01 21:04:47 +08:00   1
    php 表示不是就刷新下页面的事情吗
    wzxlovesy
        63
    wzxlovesy  
       2019-01-01 21:09:23 +08:00 via Android
    看来是没做过硬件开发,verilog 编译一遍少说几分钟,多则几小时一天……
    rus4db
        64
    rus4db  
       2019-01-01 21:12:13 +08:00   1
    写过 Verilog 的伪前端笑而不语~
    qianlv7
        65
    qianlv7  
       2019-01-01 21:26:31 +08:00
    不是,那编译型语言怎么办
    vivoapex
        66
    vivoapex  
       2019-01-01 21:44:27 +08:00
    搞 android 的不说话
    nyaapass
        67
    nyaapass  
       2019-01-01 21:52:34 +08:00
    用 jQuery 重写可还行,Vue 又不是不能 script 引入
    zhuangzhuang1988
        68
    zhuangzhuang1988  
       2019-01-01 21:57:38 +08:00
    很快乐.
    ytmsdy
        69
    ytmsdy  
       2019-01-01 22:04:51 +08:00 via iPhone
    一个 build 要 40s,热更新 5 秒的人都没叫唤呢!!
    lightzh
        70
    lightzh  
       2019-01-01 22:17:33 +08:00
    移动端路过,run 一下也是一两秒,也觉得很慢。现在在学 flutter,热更新真的爽。
    hellowes
        71
    hellowes  
    OP
       2019-01-01 22:29:50 +08:00   3
    @codermagefox 上来就说别人怪工具,能提供解决方案让它更快吗?不能的话我觉得只是打嘴炮,你怎么知道别人没有尝试过呢?
    codermagefox
        72
    codermagefox  
       2019-01-01 22:49:00 +08:00
    @hellowes 嗯嗯嗯,我在打嘴炮,您不用回我了,谢谢,新年快乐
    ibegyourpardon
        73
    ibegyourpardon  
       2019-01-01 22:52:23 +08:00   2
    朋友们,你们有没有想过,在中国大多数公司的现实情况下,有的时候编译慢是好事?

    对,我就指磨洋工。

    当项目经理非要把 7 天的工作量压到 2 天完成的时候,编译慢是你最好的武器。



    当然我不建议这么干,但有的时候,某些情况下,这是我怼人的武器。
    hellowes
        74
    hellowes  
    OP
       2019-01-01 22:59:09 +08:00
    @codermagefox 新年快乐
    gzxu
        75
    gzxu  
       2019-01-02 00:38:33 +08:00 via Android
    @imbushuo 求猫和老鼠全集!!多谢B 站上原来有英文原版的下架了,贼可惜
    superzou
        76
    superzou  
       2019-01-02 01:08:51 +08:00 via Android
    c++项目,笑而不语。
    lxml
        77
    lxml  
       2019-01-02 01:13:38 +08:00 via Android
    gopher 的快乐你想象不到
    Lullaby
        78
    Lullaby  
       2019-01-02 01:16:12 +08:00
    webpack 10s+
    AV1
        79
    AV1  
       2019-01-02 01:25:50 +08:00 via Android
    编译慢怪 vue,嗯,解锁新的黑点。
    另外,我用 vanilla,不用 jquery。
    dangyuluo
        80
    dangyuluo  
       2019-01-02 05:15:12 +08:00
    呵呵。
    ```
    Summary: 201 packages finished [13min 15s]
    ```
    orm
        81
    orm  
       2019-01-02 05:49:30 +08:00 via iPhone
    java 的话可以使用 jrebel 插件进行热部署,省去了编译重启,eclipse,IntelliJ IEDA 都有,不过这个插件是收费的
    xuanbg
        82
    xuanbg  
       2019-01-02 07:55:12 +08:00
    5 秒!真快!!我们基本上都在 30 秒以上
    shakaraka
        83
    shakaraka  
    PRO
       2019-01-02 08:13:32 +08:00
    用 jq ?用 webpack 模块开发的效率和好处就因为这 2 秒就放弃了?想必楼主分分钟几百万上下。佩服
    lihongjie0209
        84
    lihongjie0209  
       2019-01-02 08:17:47 +08:00   2
    @vinceeema 动态语言没有静态语言的编译检查, 一次写对不太可能. 话说当动态语言也需要编译的时候, 动态语言的优势何在
    gaohongyuan
        85
    gaohongyuan  
       2019-01-02 08:18:03 +08:00 via iPhone
    写安卓编译一次 5 分钟的路过,已经习惯了编译的时候切出去干别的
    389273716
        86
    389273716  
       2019-01-02 08:25:20 +08:00
    真羡慕你们,我们 android 编译的时候可以去打水喝茶上厕所
    acthtml
        87
    acthtml  
       2019-01-02 08:43:47 +08:00
    @zlgodpig 200+的页面编译时间 2~3 秒? 这个是热跟新时间还是首次编译时间?
    如果是首次编译时间那就太快了,给下电脑配置和技术栈,我参考下。
    FakeLeung
        88
    FakeLeung  
       2019-01-02 09:17:21 +08:00
    都是写小项目的路过。8 个页面,40 个 js,
    build 20s,
    dev 首次 Build completed in 22.484s 保存更新 Compiled successfully in 965ms

    电脑是 8400+16g。
    slince
        89
    slince  
       2019-01-02 09:20:44 +08:00
    @murmur 仍然很慢
    hasbug
        90
    hasbug  
       2019-01-02 09:29:04 +08:00
    忍受不了,这世间太短,不够偷懒休息。我的项目都是 2-5 分钟的编译,就一个 vue 多页面应用,总页面也才 40 个这样。
    hasbug
        91
    hasbug  
       2019-01-02 09:29:40 +08:00
    时间太短 (纠正上条错别字)
    lideshun123
        92
    lideshun123  
       2019-01-02 09:29:43 +08:00
    搞静态语言嫌开发慢 搞动态语言嫌弃运行慢 上天不得了
    ww2000e
        93
    ww2000e  
       2019-01-02 09:40:48 +08:00
    cicd 全自动化。。 坐等跟新就行了 不关心多久
    arslan2012
        94
    arslan2012  
       2019-01-02 09:43:51 +08:00 via iPhone
    Angular7 第一次 production 编译需要一小时我们也没说什么
    ooppstef
        95
    ooppstef  
       2019-01-02 09:45:27 +08:00
    做梦都不敢想的速度..你还嫌弃.
    cnanyi
        96
    cnanyi  
       2019-01-02 09:48:39 +08:00
    angular5 + webpack ,每保存一下代码,编译都要 2 分钟以上, 后来换成了 mbp, 只要不到 1 分钟了
    Lucups
        97
    Lucups  
       2019-01-02 09:50:07 +08:00
    这就是后端开发为什么大家都喜欢 PHP

    其实岂止是要多等几秒,耗电也变快了....
    xor
        98
    xor  
       2019-01-02 09:50:10 +08:00 via iPhone
    建议你多写写 Verilog
    编译一次几分钟几十分钟几个小时几天

    你就明白 2s 有多不可思议地快了
    Creabine
        99
    Creabine  
       2019-01-02 09:52:11 +08:00   1
    大家憋说了,楼主其实是 AI !
    所以楼主的时间是以 CPU 的时钟周期来计算的!
    5s === 5000 ms,基本等于人类五年了!
    缇娜,我发现了什么,这是在做图灵测试?
    C90
        100
    C90  
       2019-01-02 09:55:04 +08:00
    @lihongjie0209 漂不漂自己不知道?
    1  2  
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     2924 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 39ms UTC 13:40 PVG 21:40 LAX 05:40 JFK 08:40
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86