V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
hellowes
V2EX  ›  程序员

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

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

    最近开发前端,写到中途发现编译速度越来越慢,用的是 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 一分钟是基操....
    kefengong
        19
    kefengong  
       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 要两个小时,已经做了很多努力了
    belin520
        26
    belin520  
       2019-01-01 16:00:27 +08:00 via iPhone
    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 无所谓的吧
    nieyujiang
        37
    nieyujiang  
       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 秒的人都没叫唤呢!!
    AscenZ
        70
    AscenZ  
       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+
    DOLLOR
        79
    DOLLOR  
       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 秒以上
    wunonglin
        83
    wunonglin  
       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   ·   实用小工具   ·   2874 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 32ms · UTC 00:11 · PVG 08:11 · LAX 16:11 · JFK 19:11
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.