一种对WEB前端网页进行性能优化的方法、装置和存储介质制造方法及图纸

技术编号:31578719 阅读:10 留言:0更新日期:2021-12-25 11:21
本发明专利技术涉及一种对WEB前端网页进行性能优化的方法、装置和存储介质,所述方法包括:对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页;对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页;获取并对所述第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页。本发明专利技术克服了目前WEB前端网页性能不足的问题,通过对网页前端界面、网页以及代码等内容进行优化,为用户提供了一种界面加载速度快、代码简洁以及占用空间少的WEB前端网页,给用户带来了更加快速、稳定的服务与体验。稳定的服务与体验。稳定的服务与体验。

【技术实现步骤摘要】
一种对WEB前端网页进行性能优化的方法、装置和存储介质


[0001]本专利技术涉及互联网应用
,尤其涉及一种对WEB前端网页进行性能优化的方法、装置和存储介质。

技术介绍

[0002]随着当前互联网技术的高速发展,互联网行业发展规模越来越大,互联网技术已经融入到人们的日常生活中,人们对于互联网技术的需求也在不断增加。为了满足不断扩大的时长需求,需要对WEB前端网页的性能进行不断地优化。
[0003]对于企业来说,希望用尽可能少的资源,为更多的网站用户提供更好的浏览体验和更稳定的服务;但是对于用户而言,使他们停留在网页上继续浏览网站内容的关键因素就是网站上提供了用户所需内容且网站网页加载速度快、用户体验感强。当前网页中时常出现页面加载速度慢、图片加载不完整等问题,如何对WEB前端网页进行性能优化是当前亟需解决的问题。

技术实现思路

[0004]为解决上述技术问题,本专利技术提供了一种对WEB前端网页进行性能优化的方法和装置。
[0005]本专利技术的一种对WEB前端网页进行性能优化的方法的技术方案如下:
[0006]对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页;
[0007]对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页;
[0008]获取并对所述第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页。
[0009]本专利技术的一种对WEB前端网页进行性能优化的方法的有益效果如下:
[0010]本专利技术通过获取对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页,对第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页,获取并对第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页,因此,本申请通过上述方法克服了目前WEB前端网页页面加载慢以及图片加载不完整等问题,通过对网页前端界面、网页以及代码等内容进行优化处理,为用户提供了一种界面加载速度快、代码简洁以及占用空间少的WEB前端网页,给用户带来了更加快速稳定的服务与体验。
[0011]在上述方案的基础上,本专利技术的一种对WEB前端网页进行性能优化的方法还可以做如下改进。
[0012]进一步,所述对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页,具体包括:
[0013]利用所述HTML优化法对所述原始WEB前端网页的空白字符进行删除,并将所述原始WEB前端网页的绝对路径替换为相对路径,并将所述原始WEB前端网页的文字用标签进行表示以及将所述原始WEB前端网页中的iframe标签进行替换的方式对所述原始WEB前端网页进行优化,得到第一部分优化网页;
[0014]利用所述CSS优化法将所述第一部分优化网页中的CSS文件放入head标签,并对所述CSS文件中存在的相同样式进行提取并精简,得到第二部分优化网页;
[0015]利用所述JavaScript优化法对所述第二部分优化网页进行优化处理,得到所述第一优化网页。
[0016]采用上述进一步方案的有益效果是:对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,实现了对前端网页中部分代码的优化,通过对代码进行简洁优化,增加了用户的体验感。
[0017]进一步,所述网页图片处理技术包括CSS Sprites技术和图片懒加载技术,则所述对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页,具体包括:
[0018]利用所述CSS Sprites技术对所述第一优化网页的原始图片进行整合,并对整合得到的大图中的各个所述原始图片进行定位并加载,得到第一图片处理网页;
[0019]利用所述图片懒加载技术将所述第一图片处理网页的图片链接设置为空白,直至待加载图片进入可视窗口时,将所述待加载图片在所述第一图片处理网页中显示,并得到所述第二图片处理网页;
[0020]利用所述网页内容优化法对所述第二图片处理网页的HTML链接增加预加载功能,并将所述第二图片处理网页的内容进行缓存处理,得到所述第二优化网页。
[0021]采用上述进一步方案的有益效果是:通过对第一优化网页中的图片和内容进行优化处理,实现了对前端网页中部分图片链接、网页内容以及各属性值的优化,在上述方案的基础上,进一步提高了网页的加载速度,减少了运行时间。
[0022]本专利技术的一种对WEB前端网页进行性能优化的装置的技术方案如下:
[0023]包括:第一优化模块,第二优化模块,处理模块;
[0024]所述第一优化模块用于:对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页;
[0025]所述第二优化模块用于:对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页;
[0026]所述处理模块用于:获取并对所述第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页。
[0027]本专利技术的一种对WEB前端网页进行性能优化的装置的有益效果如下:
[0028]本专利技术通过获取对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页,对第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页,获取并对第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页,因此,本申请通过上述方法克服了目前WEB前端网页性能不足的问题,通过对网页前端界面、网页以及代码等内容进行优化,为用户提供了一种界面加载速度快、代码简洁以及占用空间少的WEB前端网页,给用户
带来了更加快速稳定的服务与体验。
[0029]在上述方案的基础上,本专利技术的一种对WEB前端网页进行性能优化的装置还可以做如下改进。
[0030]进一步,所述第一优化模块具体用于:
[0031]利用所述HTML优化法对所述原始WEB前端网页的空白字符进行删除,并将所述原始WEB前端网页的绝对路径替换为相对路径,并将所述原始WEB前端网页的文字用标签进行表示以及将所述原始WEB前端网页中的iframe标签进行替换的方式对所述原始WEB前端网页进行优化,得到第一部分优化网页;
[0032]利用所述CSS优化法将所述第一部分优化网页中的CSS文件放入head标签,并对所述CSS文件中存在的相同样式进行提取并精简,得到第二部分优化网页;
[0033]利用所述JavaScript优化法对所述第二部分优化网页进行优化处理,得到所述第一优化网页。
[0034]采用上述进一步方案的有益效果是:对原始WEB前本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种对WEB前端网页进行性能优化的方法,其特征在于,包括:对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页;对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页;获取并对所述第二优化网页中的代码进行合并与压缩,根据合并与压缩的代码得到最终优化网页。2.根据权利要求1所述的一种对WEB前端网页进行性能优化的方法,其特征在于,所述对原始WEB前端网页依次采用HTML优化法、CSS优化法和JavaScript优化法进行处理,得到第一优化网页,具体包括:利用所述HTML优化法对所述原始WEB前端网页的空白字符进行删除,并将所述原始WEB前端网页的绝对路径替换为相对路径,并将所述原始WEB前端网页的文字用标签进行表示以及将所述原始WEB前端网页中的iframe标签进行替换的方式对所述原始WEB前端网页进行优化,得到第一部分优化网页;利用所述CSS优化法将所述第一部分优化网页中的CSS文件放入head标签,并对所述CSS文件中存在的相同样式进行提取并精简,得到第二部分优化网页;利用所述JavaScript优化法对所述第二部分优化网页进行优化处理,得到所述第一优化网页。3.根据权利要求1或2所述的一种对WEB前端网页进行性能优化的方法,其特征在于,所述网页图片处理技术包括CSS Sprites技术和图片懒加载技术,则所述对所述第一优化网页依次采用网页图片处理技术和网页内容优化法进行处理,得到第二优化网页,具体包括:利用所述CSS Sprites技术对所述第一优化网页的原始图片进行整合,并对整合得到的大图中的各个所述原始图片进行定位并加载,得到第一图片处理网页;利用所述图片懒加载技术将所述第一图片处理网页的图片链接设置为空白,直至待加载图片进入可视窗口时,将所述待加载图片在所述第一图片处理网页中显示,并得到所述第二图片处理网页;利用所述网页内容优化法对所述第二图片处理网页的HTML链接增加预加载功能,并将所述第二图片处理网页的内容进行缓存处理,得到所述第二优化网页。4.一种对WEB前端网页进行性能优化的装置,其特征在于,包括...

【专利技术属性】
技术研发人员:覃楼陈凯李贵薪周思成谢帆周万力
申请(专利权)人:桂林长海发展有限责任公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1