js的动态加载、缓存、更新以及复用(二)
上一篇发出来后得到了很多回复,在此首先感谢大家的热情捧场!有的推荐第三方框架,比如 In.js、requrieJS、sea.js、lab.js等。这个开阔了眼界,以前只知道sea.js,省去了自己搜索的麻烦。也用了点时间简单看了一下,因为每一个都是大块头,都有自己的理念,如果只是简单使用的话,那么谁便找一个就可以了,但是我习惯把原理弄清楚。因为我觉得虽然不知道原理也可以使用,但是知道了原理后,可以用的更好。
主要看的是sea.js,目前简单的理解是:一个加载js的机制 + 模块化编程(CMD规范)的理念。这个是淘宝用的,肯定很强大、很结实了。那么我是不是拿来用呢?这就要看看我到底想要什么,以及改动量大小。
那么我想要啥呢?第一步只想要一个可以动态加载js的代码,越简单越好。为啥呢?越简单就越不需要修改。为啥要求不需要修改呢?因为我想达到的效果是,每个页面只需要 <script type="text/javascript" src="/boot.js"></script> 这么一行,就可以把所有的共用的js文件都统统的加载进来,并且可以自动更新。
不知道大家有没有发现一个问题,boot.js 可以搞定其他js文件的更新,但是他自己的更新如何搞定呢?有两个方法,一个是在后面加个随机数作为参数;另一个就是一辈子都不需要修改。我不想用前者,因为每次都要去服务器加载,和初衷不符。我想用后者,当然我也知道,不可能一辈子不变,只能尽量延迟修改的时间。所以就需要——简单。越简单越不需要修改,也就可以保持更长的时间。所以我起名叫做 boot。就是一个简单的引导(加载)的功能。
第二步才开始真正的管理js文件。这时候可以考虑使用第三方框架,当然也可以自己写。因为我可以用boot.js来确保加载哪些文件,以及加载最新的文件。在第二步就需要确定一个解决方案。我的想法就是做一个js文件服务。由这个服务实现加载js、更新js、加载顺序(依赖),还有复用。
如果我们要做五个项目,每个项目都是一个独立的站点,那么对于共用的js文件是怎么处理的呢?1、每个项目站点都放一份,引用自己站点里的。2、做一个独立的站点存放共用的js,然后其他的项目都统一到这里引用。我用的是第二个方法,你们呢?
突然想到一个问题,我们写js到底要达到什么目的(效果)?基础功能(jQuery、my97、editor等)、UI(easyUI等)、处理业务逻辑(做点判断了啥的)。还有其他的啥。我们每写一个js文件,都需要考虑要引用哪些文件吗?目前我做的项目是,由js文件服务来搞定js文件的加载,然后写点处理业务逻辑的代码就ok了。
想说的还有很多,只是思路有点乱。后续要上具体的代码了,不知道大家是不是喜欢。
ps:
面对的问题。引用 https://github.com/seajs/seajs/issues/547
恼人的命名冲突
我们从一个简单的习惯出发。我做项目时,常常会将一些通用的、底层的功能抽象出来,独立成一个个函数,比如
function each(arr) {
// 实现代码
}
function log(str) {
// 实现代码
}
并像模像样地把这些函数统一放在 util.js 里。需要用到时,引入该文件就行。这一切工作得很好,同事也很感激我提供了这么便利的工具包。
直到团队越来越大,开始有人抱怨。
小杨:我想定义一个 each 方法遍历对象,但页头的 util.js 里已经定义了一个,我的只能叫 eachObject 了,好无奈。
小高:我自定义了一个 log 方法,为什么小明写的代码就出问题了呢?谁来帮帮我。
抱怨越来越多。团队经过一番激烈的讨论,决定参照 Java 的方式,引入命名空间来解决。于是 util.js 里的代码变成了
var org = {};
org.CoolSite = {};
org.CoolSite.Utils = {};
org.CoolSite.Utils.each = function (arr) {
// 实现代码
};
org.CoolSite.Utils.log = function (str) {
// 实现代码
};
引用结束。
现在我采用的也是命名空间的方式,当然是按照.net的习惯来的。

好的js文件艾
不知不觉居然写了这么多。用命名空间确实便于管理。尤其是管理源码。另外也应该学习一下CMD、AMD都是啥,自己写的代码也应该规范一点。
js的动态加载、缓存、更新以及复用(二)的更多相关文章
- js的动态加载、缓存、更新以及复用(四)
本来想一气呵成,把加载的过程都写了,但是卡着呢,所以只好在分成两份了. 1.页面里使用<script>来加载 boot.js . 2.然后在boot.js里面动态加载 bootLoad.j ...
- js插件动态加载js、css解决方案
最近因为工作需要做了一个js自动导入的插件,一开始很天真的以为动态创建个script添加到head中就ok了,试了之后才发现了问题,就是如果同时引入了多个js文件,而且后一个文件中用到了前一个文件中的 ...
- js实现动态加载脚本的方法实例汇总
本文实例讲述了js实现动态加载脚本的方法.分享给大家供大家参考,具体如下: 最近公司的前端地图产品需要做一下模块划分,希望用户用到哪一块的功能再加载哪一块的模块,这样可以提高用户体验. 所以到处查 ...
- js的动态加载、缓存、更新以及复用(一)
使用范围: OA.MIS.ERP等信息管理类的项目,暂时不考虑网站. 遇到的问题: 完成一个项目,往往需要引用很多js文件,比如jQuery.js.easyUI等.还有自己写的一些列js文件,那么这些 ...
- js的动态加载、缓存、更新以及复用
使用范围: OA.MIS.ERP等信息管理类的项目,暂时不考虑网站. 遇到的问题: 完成一个项目,往往需要引用很多js文件,比如jQuery.js.easyUI等.还有自己写的一些列js文件,那么这些 ...
- js的动态加载、缓存、更新以及复用(三)
总体思路 1. 建立一个js服务,该服务实现通用js文件的加载.依赖.缓存.更新以及复用. 2. 各个项目如果使用通用js,可(bi)以(xu)使用js服务实现加载. 3. Js服务只提供通用的 ...
- Ext JS 如何动态加载JavaScript创建窗体
JavaScript不需要编译即可运行,这让JavaScript构建的应用程序可以变得很灵活.我们可以根据需要动态从服务器加载JavaScript脚本来创建和控制UI来与用户交互.下面结合Ext JS ...
- js怎么动态加载js文件(JavaScript性能优化篇)
下面介绍一种JS代码优化的一个小技巧,通过动态加载引入js外部文件来提高网页加载速度 [基本优化] 将所有需要的<script>标签都放在</body>之前,确保脚本执行之前完 ...
- 篇一:js中动态加载---append
之前是一行代码,不能动态加载,新的需求要动态加载,使用append $('#Order_information').append(' <div class="single_produc ...
随机推荐
- 快速入门系列--WebAPI--03框架你值得拥有
接下来进入的是俺在ASP.NET学习中最重要的WebAPI部分,在现在流行的互联网场景下,WebAPI可以和HTML5.单页应用程序SPA等技术和理念很好的结合在一起.所谓ASP.NET WebAPI ...
- Android入门(十)SQLite创建升级数据库
原文链接:http://www.orlion.ga/603/ 一.创建数据库 Android为了让我们能够更加方便地管理数据库,专门提供了一个 SQLiteOpenHelper帮助类, 借助这个类就可 ...
- Testing - 质量保证与质量控制
QA QC QM 概念 Quality Assurance (质量保证) Quality Control (质量控制) Quality Manage (质量管理) 定义 为达到质量要求所采取的作业技术 ...
- javascript学习总结(一):基础知识。
1 数据类型a.数据类型共有7种,字符串(string).数字(number).布尔(boolean).数组(array).对象(object).Null.Undefined. 其中布尔(逻辑)类型只 ...
- JS实现base64加密解密
JS实现base64加密解密 转载自http://blog.csdn.net/fengzheng0306/archive/2006/04/25/676055.aspx 方法一: <HTML> ...
- File Type Icons – 免费扁平设计风格文件类型图标集
这套扁平风格图标集包含一组62个不同的文件类型图标,有 AI,ICO和 PNG 三种格式.他们采用长阴影模式的扁平化设计,看起来非常整齐和现代化.这些图标是完全免费的,可以用于商业项目. 您可能感兴趣 ...
- nginx+uwsgi+django+celery+supervisord环境部署
前言 很久没更博客了,最近新写了一个小项目,后边有时间把一些心得放上来,先把环境的部署方式整理出来. 部署过程 先将环境的python升级为2.7 保证有pip 安装了nginx并配置 vim /Da ...
- Net.Sockets
#region 程序集 System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 // C:\Program ...
- DES加密解密
加密后生成Base64字符串,并去除'='字符. 加密后替换掉'+',这样加密后的字符串可以作为url参数传递. using System; using System.IO; using System ...
- iis 不能访问json文件
我从网上查的资料,解决方案都是设置MIME 映射和“处理脚本映射”. 我按照网上的解决方案执行之后还没有解决我的这个问题,所以我想会不会是其他的原因. 在那么一瞬间,灵光一闪,我把json文件放到新建 ...