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

JavaScript 模块化疑问

  •  
  •   pertersonvv · 2014-12-30 15:57:27 +08:00 · 4268 次点击
    这是一个创建于 3627 天前的主题,其中的信息可能已经有所发展或是发生改变。

    a.js define [b, c, d], function(){} ,
    b.js [e, f, g], function(){},
    e.js [h, i] , function(){} 包含a.js, requirejs是否会自动加载a b c d e f g h i 7个js文件?

    加载7模块,要发送7次http请求,是不是有点多了?
    可是把所有代码写在一个文件里面,是不是有点乱?

    呵呵,大家是如何看到JS模块化这个问题的?

    32 条回复    2014-12-31 08:48:08 +08:00
    datou552211
        1
    datou552211  
       2014-12-30 16:07:54 +08:00
    会,实际上是执行了一遍代码,遇到重复加载的就会跳过
    iwege
        2
    iwege  
       2014-12-30 16:12:44 +08:00
    requirejs 有自己的optimize api,可以将文件合并。当然也可以自己合并。
    pepsin
        3
    pepsin  
       2014-12-30 16:16:41 +08:00
    控制好粒度吧。最近看到一堆人鼻屎大的东西都搞个模块,也是惊了。
    pertersonvv
        4
    pertersonvv  
    OP
       2014-12-30 16:25:39 +08:00
    @datou552211 合并后文件的文本顺序是否为 h i e f g c d a?
    pertersonvv
        5
    pertersonvv  
    OP
       2014-12-30 16:26:58 +08:00
    @iwege 合并后,就一个a.js,其他几个都合并到a.js么?
    jasonslyvia
        6
    jasonslyvia  
       2014-12-30 16:34:53 +08:00
    骚年,有个东西叫 browserify,还有个东西叫 webpack,有兴趣的话可以在 server 端处理 js 的 combo,读一下 requirejs 的 config 就好
    pertersonvv
        7
    pertersonvv  
    OP
       2014-12-30 16:40:12 +08:00
    @jasonslyvia 在浏览器中跑node模块,太夸张了吧,node依赖一堆的,网络怎么加载,node的文件接口,浏览器能执行?
    miser
        8
    miser  
       2014-12-30 16:41:08 +08:00
    @pertersonvv 有试过合并吗?
    damngood
        9
    damngood  
       2014-12-30 16:46:01 +08:00
    @pertersonvv browserify 只是保持了 node 的接口, 对于不能在浏览器环境中运行的接口有做相应的 shim
    pertersonvv
        10
    pertersonvv  
    OP
       2014-12-30 16:49:09 +08:00
    @damngood shim是装饰器吧,关键是浏览器JS不能读本地文件的啊,用了browserify,浏览器可以读写本地文件?
    datou552211
        11
    datou552211  
       2014-12-30 17:17:27 +08:00 via iPhone
    browerify把require的包内容合并了
    akfish
        12
    akfish  
       2014-12-30 17:20:40 +08:00
    lz要是玩玩polymer还不被吓死,连HTML页面都是拆成无数块然后import进来的。
    boom11235
        13
    boom11235  
       2014-12-30 18:00:44 +08:00
    前端模块化一直是个麻烦的问题,也有很多相关的解决方案出来,requirejs,seajs,duo,webpack,spm等。模块粒度过细,如果不打包或者服务器做combo,会导致请求过多,性能不好,一般不考虑在线上直接使用加载多个的方案,而combo和打包则需要考虑缓存失效问题,稳定下来的模块或者不怎么更新的第三方模块和经常变动的模块需要分开处理。细化下去,还有各种各样的细节问题,楼主请自行挖掘。
    boom11235
        14
    boom11235  
       2014-12-30 18:02:58 +08:00
    楼主不用纠结浏览器JS读写本地文件的问题,browserify没说它提供本地fs的读写模块,请详见文档。browserify提供的模块大多都是在实际应用中在浏览器有使用价值和可能性的模块,而不是全包。
    RoshanWu
        15
    RoshanWu  
       2014-12-30 18:07:27 +08:00
    pertersonvv
        16
    pertersonvv  
    OP
       2014-12-30 18:10:49 +08:00
    @pepsin 粒度怎么划分 才是合理的呢?
    pertersonvv
        17
    pertersonvv  
    OP
       2014-12-30 18:33:57 +08:00
    @akfish 这货官网居然需要翻墙:(
    kmvan
        18
    kmvan  
       2014-12-30 18:52:36 +08:00
    我也纠结过模块化合并的问题,我用的是 wp, 想要写个 php 合并程序来合并主题的 commonjs 模块。
    一直在分析如何依赖和合并的优先级等问题,头都大。 你看我这博客 http://inn-studio.com 就是因为还没合并,init.js 模块文件一堆堆,哎。。。
    ianva
        19
    ianva  
       2014-12-30 19:08:05 +08:00
    如果是 requirejs 的话就 r.js,各种模块管理都有各自的方案
    pertersonvv
        20
    pertersonvv  
    OP
       2014-12-30 19:14:55 +08:00
    @kmvan 这个wp主题你自己弄的?
    pertersonvv
        21
    pertersonvv  
    OP
       2014-12-30 19:17:06 +08:00
    @kmvan 楼主不是码农,哈哈
    bigcoon
        22
    bigcoon  
       2014-12-30 19:43:51 +08:00
    用grunt合并,有空研究下Ghost的前端源码,模块化做得不错

    另外搭车问下,像Ghost的前端这种模块化程度,我开发的时候是不是很不方便?
    jerray
        23
    jerray  
       2014-12-30 20:59:08 +08:00
    开发环境可以不合并,让requirejs异步加载文件。发布之前用r.js合并一下就可以了。
    un
        24
    un  
       2014-12-30 22:20:59 +08:00
    @pepsin 哈哈。经常看到 20 行不到的代码也要打个包。
    kmvan
        25
    kmvan  
       2014-12-30 22:27:25 +08:00
    @pertersonvv 这个wp主题你自己弄的?
    是的,如果我能解决在 wp 上合并 commonjs 模块文件的问题,估计就是World first 了。估计我只能从 seajs 源码和 spm 中山寨到php中才行。
    muzuiget
        26
    muzuiget  
       2014-12-30 23:01:07 +08:00
    现在深度使用了 dojo,dojo 就是用这种 AMD 模块,看上去很美好,其实坑很多,蛋疼无比。

    郁闷之余去 Google 了下「JavaScript AMD sucks」,第一篇是

    http://tomdale.net/2012/01/amd-is-not-the-answer/

    Ember.js 作者之一写的,很认同他的观点。
    pepsin
        27
    pepsin  
       2014-12-30 23:19:59 +08:00
    @pertersonvv 多碰坑多试试 Edge 环境加载那些个美好的页面~
    pertersonvv
        28
    pertersonvv  
    OP
       2014-12-31 00:38:42 +08:00
    @pepsin
    @jerray 用r.js合并,是否要安装grunt?
    jerray
        29
    jerray  
       2014-12-31 01:25:30 +08:00
    @pertersonvv 不需要。跟grunt没关系的。
    yjfengwen
        30
    yjfengwen  
       2014-12-31 01:28:22 +08:00
    感觉这是一个工程化的东西,比较同意张云龙前端工程化的观点。https://github.com/fouber/blog/issues/2
    thonatos
        31
    thonatos  
       2014-12-31 02:53:47 +08:00 via Android
    一直在用spm,很舒心。
    lwbjing
        32
    lwbjing  
       2014-12-31 08:48:08 +08:00
    上线前根据依赖打包下就好了。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5764 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 34ms · UTC 03:23 · PVG 11:23 · LAX 19:23 · JFK 22:23
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.