javascript - 如何在文件中组织 OO js 代码?本地网络应用

标签 javascript oop yui code-organization

我目前正在开发一个将在B2B 环境 中在本地网络上运行的应用程序。所以我几乎可以忘记在节省带宽方面的微型(迷你?)优化因为Hardware Is Cheap, Programmers Are Expensive .

我们在项目中有一个结构良好的面向对象的 js 代码,显然很多 js 类。如果所有的类都存储在单独的文件中,那么浏览这段代码并因此对其进行维护将非常容易。

但这将使我的浏览器生成几十个HTTP 请求,以获取我在页面上需要的所有 js 文件/类。即使在本地环境中,它在第一次加载时也不是非常快(缓存为空),稍后当您修改它时缓存必须失效。

可能的解决方案:

  • 违反规则“每个文件一个类”
  • 使用YUI compressor一直(在开发和生产中)生成一个大的 js 文件。

但是如果我们为此选择 YUI 压缩器(在开发环境中没有缩小操作,而在生产环境中缩小操作)——那么我们需要在任何 js 文件中的每次修改时重新加载/重新编译这个大的 js 文件。

你会推荐什么来解决这个问题?

最佳答案

将所有 .js 文件分开。保持“每个文件一个类”的规则。

然后,使用服务器端技术将脚本聚合到一个请求中。

选项:

  1. 使用 ASPX 或 PHP 或任何你拥有的服务器端脚本,将所有 JS 聚合到一个请求中。对 .js 的请求不再是静态文件,但通过在服务器上进行缓存,它的服务成本应该相对较低。

  2. 在统一的 .js 文件中使用服务器端包含。

    <!--#include virtual="/class1.js"-->
    <!--#include virtual="/class2.js"-->

关于javascript - 如何在文件中组织 OO js 代码?本地网络应用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1688886/

相关文章:

javascript - 异步 JavaScript 最佳实践

javascript - 原型(prototype)与类

javascript - 检查Javascript是否包含特定方法

html - 简单的 Off Canvas 菜单不起作用

html - 删除 YUI Rich Editor 标题并使其不可折叠

javascript - 使用 FCKeditor 插件插入 "placeholders",稍后用动态内容替换

javascript - 如何在文本中获取自定义标签,并放入另一个文本?

javascript - Gulp-rev-all 在每次运行时创建新文件

c++ - 删除默认构造函数会导致 STL 容器中的默认分配器出现问题

javascript - 与 Flex AIR 相比,基于 HTML 的 AIR 应用程序是否同样快速/强大,或者只是一个 "lesser"兄弟?