[发明专利]基于组件开发模式下的前端加载优化方法、存储介质有效
申请号: | 201811359822.3 | 申请日: | 2018-11-15 |
公开(公告)号: | CN109614162B | 公开(公告)日: | 2023-10-10 |
发明(设计)人: | 刘德建;陈铭;高举全;郭玉湖 | 申请(专利权)人: | 福建天泉教育科技有限公司 |
主分类号: | G06F9/445 | 分类号: | G06F9/445 |
代理公司: | 福州市博深专利事务所(普通合伙) 35214 | 代理人: | 张明;石晋龙 |
地址: | 350212 福建省福州市长乐*** | 国省代码: | 福建;35 |
权利要求书: | 查看更多 | 说明书: | 查看更多 |
摘要: | |||
搜索关键词: | 基于 组件 开发 模式 前端 加载 优化 方法 存储 介质 | ||
1.基于组件开发模式下的前端加载优化方法,其特征在于,包括:
配置在webpack打包过程不进行静态文件的加载;
webpack打包前端代码时,将各组件的公共库打包到第三方库,生成包含第三方库的静态文件;
上传所述第三方库至公共服务器;
在入口文件遍历获取所述静态文件的文件名列表,在其中对应所述第三方库的文件名中添加所述公共服务器的域名和对应代码类型的资源标签;
浏览器启动一组件后,通过访问所述入口文件,依据所述一组件对应的资源标签所对应的文件名记载的域名从本地或所述公共服务器加载对应的静态文件。
2.如权利要求1所述的基于组件开发模式下的前端加载优化方法,其特征在于,还包括:
浏览器缓存已加载的静态文件;
启动另一组件后,判断所述另一组件对应的资源标签所对应的静态文件是否已缓存,若是,则从缓存中获取所述对应的静态文件。
3.如权利要求1所述的基于组件开发模式下的前端加载优化方法,其特征在于,所述配置在webpack打包过程不进行静态文件的加载,具体为:
通过修改node工程下的第一配置文件其中的webpack插件的第二配置文件,配置在webpack打包过程不进行静态文件的加载。
4.如权利要求1所述的基于组件开发模式下的前端加载优化方法,其特征在于,所述webpack打包前端代码时,将各组件的公共库打包到第三方库,生成包含第三方库的静态文件,具体为:
通过修改node工程下的第三配置文件,增加变量第三方库;
在webpack的入口配置中加入所述变量第三方库;
webpack打包前端代码时,依据所述入口配置将各组件的公共库打包到所述变量第三方库中;
生成包含第三方库的静态文件,并存储至本地。
5.如权利要求1所述的基于组件开发模式下的前端加载优化方法,其特征在于,所述在入口文件遍历获取所述静态文件的文件名列表,在其中对应所述第三方库的文件名中添加所述公共服务器的域名和对应代码类型的资源标签,具体为:
通过修改node工程下的入口文件,遍历所述静态文件,获取对应静态js代码的第一文件名列表和对应静态css代码的第二文件名列表;在所述第一文件名列表和第二文件名列表中对应所述第三方库的文件名中添加所述公共服务器的域名;在第一文件名列表的各个文件名中添加script标签,在第二文件名列表的各个文件名中添加link标签。
6.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述程序在被处理器执行时,能实现上述权利要求1-5所述的基于组件开发模式下的前端加载优化方法所包含的步骤。
该专利技术资料仅供研究查看技术是否侵权等信息,商用须获得专利权人授权。该专利全部权利属于福建天泉教育科技有限公司,未经福建天泉教育科技有限公司许可,擅自商用是侵权行为。如果您想购买此专利、获得商业授权和技术合作,请联系【客服】
本文链接:http://www.vipzhuanli.com/pat/books/201811359822.3/1.html,转载请声明来源钻瓜专利网。