本发明涉及一种前端资源打包处理领域。更具体地说,本发明涉及一种基于遗传算法的前端资源打包方法。
背景技术:
1、资源打包技术在前端发挥着至关重要的作用,其质量直接影响用户浏览网页内容的体验。传统的打包工具通常倾向于将所有资源打包成一个或少数几个文件,导致每次访问页面都需加载大量资源。尤其在大型网页中,庞大的打包文件会增加网络传输时间,降低网页加载速度,同时可能导致重复加载文件,浪费浏览器资源。
2、虽然先前的技术也对打包方法和资源加载进行了优化,例如:专利《一种资源加载方法、装置、服务器及存储介质》,其方法通过依赖关系预加载目标资源及相关资源,但其主要关注解决由调用特定资源产生的冗余信息,未着重解决因资源过大而导致效率低下的问题。
3、另一专利《一种基于贪婪算法的游戏资源打包方法及系统》通过使用贪婪算法,以资源加载顺序作为输入,得到基于资源使用概率的打包资源,减少加载资源数目。然而,该方法未考虑资源之间的直接依赖关系,有时可能直接影响整个应用是否能够成功运行。
4、综上,现有技术中存在的问题主要包括:
5、1.现有的打包方法往往将所有的资源一股脑的打包,导致打包体积庞大,导致网络加载过程中耗费时间过长,严重影响用户体验。
6、2.针对全量打包出现请求加载时会有大量冗余资源的问题,且多个包之间的资源分配问题也无法解决。
技术实现思路
1、本发明的一个目的是解决至少上述问题和/或缺陷,并提供至少后面将说明的优点。
2、为了实现本发明的这些目的和其它优点,提供了一种基于遗传算法的前端资源打包方法,包括:
3、s1、将页面文件引入的资源文件视为入口文件,将前端应用的各页面文件所对应的入口文件进行说明;
4、s2、通过遍历资源,以得到基于入口文件生成的依赖关系表;
5、s3、以入口文件为中心,基于依赖关系表,生成资源组及资源组关系图;
6、s4、从资源组中提取相同部分得到对应的资源桶;
7、s5、通过将资源桶与资源组进行绑定操作,完成包生成前的准备工作;
8、s6、通过遗传算法为资源桶分配包体积及数目,进而能得到以资源桶为单位,且不会重复生成的包;
9、s7、基于生成包重写页面文件,完成打包工作。
10、优选的是,在s2中,所述依赖关系表的获取方式为:
11、s21、通过从入口文件捕获关键词以获取依赖资源的路径;
12、s22、通过babel完成对静态资源的遍历,并将其转化为es5标准;
13、s22、以"‘文件相对路径’:function()"的格式保存文件转化后的代码,进而构建包括文件名及其依赖组的依赖关系表。
14、优选的是,在s3中,资源组的获取方式为从入口文件开始,遍历依赖关系表,将与入口文件直接或间接相关的依赖文件进行分组,形成资源组及资源组关系图。
15、优选的是,在s4中,资源桶的获取方式为:
16、s40、对s3生成的资源组进行遍历以构建对应的资源组关系图;
17、s41、对s3生成的资源组关系图,通过分开打包的方式,生成资源桶;
18、其中,所述资源桶是将相关资源组名字符串相加作为命名。
19、优选的是,在s5中,所述准备工作包括:
20、s51、通过查询资源桶名是否包含资源组名来判断是否进行确认并保存的绑定操作;
21、s52、循环遍历资源桶,并统计每个桶内各个文件的体积大小;
22、s53、基于资源桶内文件数目、各个文件的大小、包最大体积、包最小体积以及遗传算法所需参数完成数据准备工作。
23、优选的是,在s6中,通过遗传算法为资源桶分配包体积及数目的方式为:
24、s60、初始化产生一个打包方法的种群;
25、s61、使用以下适应度函数f来对s60的打包方法进行检验:
26、
27、上式中,sall代表全部大小,smax代表规定包大小上限,n为包个数,slast为最后一个包大小,为适应度函数f设置约束条件,若不满足则对适应度函数f进行取反操作;
28、s62、在种群中选择适应度最高作为判读是否完成迭代的条件,采用锦标赛选择原种群中出现次数最多的个体;
29、s63、采用随机交换几个模块桶之间的顺序的方式生成下一代种群;
30、s64、判断是否达到指定迭代次数或满足最高适应度,若是则算法处理流程结束,否则重复s61至s63,以寻找最优解,以得到包个数以及每个包中所含资源顺序。
31、优选的是,所述包的生成方法为:
32、s65、基于遗传算法的结果,通过遍历资源桶内的文件名得到转化后的es5代码;
33、s66、使用node模块fs将代码写入文件,且文件顶端将以字符串的形式加入一个调用函数,完成包中资源的注册。
34、优选的是,在s7中,重写页面文件是通过在页面文件的<script>的标签中添加代码来实现;
35、其中,所述代码内容包括注册方法及导入生成的包,所述注册方法包括:注册包中资源信息“_register_”、改写调用资源方法“_require_”
36、本发明至少包括以下有益效果:
37、其一,本发明的处理方法可有效减少包体积,即根据依赖关系将资源生成多个包,减少了打包后的体积,以此减少了网页加载过程中出现阻塞的可能性,同时引入遗传算法,得到结果来限制包的数量和大小(主要防止过小)而解决浪费加载资源的问题。
38、其一,本发明的处理方法通过资源桶的设计得到了最小复用单元,可有效增加缓存利用率,即在多个资源组对同一个模块的重复调用加载的情况下,提出了抽离这些被重复加载的资源,形成了一个资源桶,然后通过对这个模块桶进行缓存,成功地解决了网页重复加载同一模块的问题。
39、本发明的其它优点、目标和特征将部分通过下面的说明体现,部分还将通过对本发明的研究和实践而为本领域的技术人员所理解。
1.一种基于遗传算法的前端资源打包方法,其特征在于,包括:
2.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s2中,所述依赖关系表的获取方式为:
3.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s3中,资源组的获取方式为从入口文件开始,遍历依赖关系表,将与入口文件直接或间接相关的依赖文件进行分组,形成资源组及资源组关系图。
4.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s4中,资源桶的获取方式为:
5.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s5中,所述准备工作包括:
6.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s6中,通过遗传算法为资源桶分配包体积及数目的方式为:
7.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,所述包的生成方法为:
8.如权利要求1所述的基于遗传算法的前端资源打包方法,其特征在于,在s7中,重写页面文件是通过在页面文件的<script>的标签中添加代码来实现;