零到OM-第5幕

在这一部分中,我们将更深入地了解应用程序的构建配置,并发现它可以为我们做些什么。源代码位于github.

注:我强烈建议阅读上岗首先,如果你还没有这样做。


构建配置

项目的生成配置在中定义工程项目.它是用Clojure写的,看起来像这样:

;项目,CLJ,第1部分(defproject todomvc“0.1.0-snapshot”:jvm opts^:replace[“-xms4g”“-xmx4g”“-server”]:dependencies[[org.clojure/clojure“1.6.0”][org.clojure/clojurescript“0.0-2280”][org.clojure/core.async“0.1.267.0-0d7780-alpha”][秘书“1.2.0”][om“0.7.1”]:plugins[[lein cljsbuild“1.0.4-快照”]]

基本上,它只是一幅矢量图。这个依赖关系从雷宁根自动加载。CLSJBED是一个允许将clojurescript编译为javascript的插件-其配置为:

;项目,CLJ,第2部分:源路径[“src”]:cljsbuild:builds[:id“dev”:源路径[“src”]:编译器:输出到“app.js”:输出目录“out”:优化:无:源映射真])

早些时候,我们了解到要构建我们可以使用的应用程序Lein Cljsbuild Once开发.命令启动leiningen并执行DEV生成的配置文件CLSJBED正好一次。如果我们使用汽车相反,它监视源路径的任何更改并触发一个构建。开发时非常方便。

如果你调查外面的生成后,项目根目录中的文件夹,您将看到我们指定的每个依赖项都有一个文件夹。在里面你可以找到图书馆的源文件,在clojurescript和javascript中。此外,谷歌关闭库文件可以在古格目录。

注:这个源图选项告诉插件生成 J.S.地图 每个编译文件的文件。这允许浏览器在出现运行时错误时向您显示相应的ClojureScript源代码,而不是不可理解的混乱的javascript代码。

出版业

有一天你会想要发布你的应用程序并与世界分享它。这个外面的文件夹大致包含2 MB的javascript.更不用说它们分散在88个独立的文件中。听起来像是对浏览器基准的要求,不像一个可用的Web应用程序!

所以我们需要减少文件的数量和总的文件大小。这就是Google闭包编译器可以帮助我们的地方。下面是一个新的构建配置文件,名为释放这将解决我们所有的问题:

:cljsbuild:builds[:id“dev”…:id“release”:源路径[“src”]:编译器:输出到“out/app.min.js”:优化:高级:elide断言为真:漂亮打印为假:源映射“app.js.map”:externs[“src/react externs.js”]]

相比之下DEV配置文件它输出一个文件,使用高级优化,删除断言,但不会很好地打印JavaScript代码。要运行此生成配置文件,我们使用lein cljsbuild一次发布.这比开发概要文件要花更长的时间,但我们只会在我们真正想要发布应用程序时运行它。

注:闭包编译器是迷你们中的斗牛犬:非常好斗,无人停车。这就是为什么您需要告诉它使用“externs文件”不应删除的代码,如反应器在我们的例子中。

下表给出了不同选项对最终结果的影响。它显示了闭包编译器提供的不同“模式”的文件大小:

模式 大小 GZIP尺寸
空白区 1343千字节 180千字节
简单的 858千字节 119千字节
先进的 192千字节 47千字节


与简单模式相比,高级模式减少了大约78%的文件大小。闭包编译器通过进行死代码分析来实现这种缩小:删除应用程序不使用的javascript代码。

因此,我们可以预期的最佳结果是47 kb gzip。听起来很合理。为了比较,没有选择权:elide断言为真高级模式的结果将增长到195 KB(48 KB gzip)。不设:漂亮打印错误它甚至可以增长到275 kb(53 kb gzip)。

当然,我们遗漏了一件事:反应库的足迹。最小版本为123 kb(34 kb gzip)。这使得gzip总共有81kb。我让你自己决定这个值是否可以接受你的应用程序:


每日小贴士:Leiningen允许您为单个或多个命令指定别名。这种方式,我们可以创建一个出版使用发布配置文件运行生成的命令-并预先执行清理:

:别名“publish”[“do”[“cljsbuild”“clean”][“cljsbuild”“once”“release”]

展望

有一个项目叫影子建筑这样可以将最终的javascript文件拆分为多个文件,例如将公共代码(如标准库)放在一个文件中,其余的放在单独的文件中。然后您可以在应用程序中有单独的“区域”。例如,不进入管理部分的用户不需要下载其源代码。目前,直接将此功能引入ClojureScript是正在讨论.


这就结束了我们建造设施的旅程。最后,我建议你看一下cljsbuild示例曾经。它记录了clojurescript插件的所有可能选项。

第6幕我们将看看那些帮助我们创建更好的OM应用程序的库!


评论由迪斯科