2016 - 2024

感恩一路有你

前端页面代码大小优化 前端开发,页面优化,性能优化有哪些方面?

浏览量:3784 时间:2023-06-19 11:49:18 作者:采采

前端开发,页面优化,性能优化有哪些方面?

感觉前端表现真的很重要。我来说说我在实际项目中的应用。前端的应用主要从以下几个方面进行优化:

1.减少http请求

HTTP协议是一种无状态的应用层协议,这意味着每个HTTP请求都需要建立通信链路,传输数据。在服务器端,每个HTTP需要启动一个独立的线程来处理它。这些通信和服务是昂贵的,减少HTTP请求的数量可以有效地提高访问性能。减少HTTP的方法主要是合并CSS、JavaScript和图片。把浏览器一次访问需要的JavaScript和CSS合并成一个文件,这样浏览器只需要一次请求。图片也可以合并,多张图片合并成一张。如果每张图片有不同的超链接,CSS offset可以用来响应鼠标点击,构造不同的URL。

2.使用浏览器缓存

对于一个网站来说,CSS、JavaScript、Logo、图标等静态资源文件更新的频率较低,几乎每个HTTP请求都需要这些文件。如果将这些文件缓存在浏览器中,性能可以大大提高。通过在HTTP头中设置Cache-Control和Expires属性,可以设置浏览器缓存,缓存时间可以是几天甚至几个月。在某些情况下,静态资源文件的更改需要及时应用到客户端浏览器。在这种情况下,可以通过改变文件名来实现,即更新JavaScript文件不是更新JavaScript文件的内容,而是生成一个新的JS文件,更新HTML文件中的引用。使用浏览器缓存策略的网站在更新静态资源时,应采用批量更新的。例如,如果需要更新10个图标文件,不建议一次更新所有10个文件,而是一次更新一个文件,间隔一定时间,这样可以避免用户 浏览器和缓存的集中更新,导致服务器负载骤增,网络拥塞。

3.启用压缩

在服务器端压缩文件,在浏览器端解压缩文件,可以有效减少通信传输的数据量。文本文件的压缩效率可以达到80%以上,所以对HTML、CSS、JavaScript文件启用GZip压缩可以达到更好的效果。但是压缩对服务器和浏览器造成了一定的压力,在通信带宽好,服务器资源不足的情况下要考虑。

4.CSS放在页面顶部,JavaScript放在页面底部。

浏览器会在下载完所有的CSS后呈现整个页面,所以最好的做法是将CSS放在。在页面顶部,让浏览器尽快下载CSS。而JavaScript则是浏览器在加载JavaScript后立即执行,可能会阻塞整个页面,导致页面显示缓慢,所以JavaScript最好放在页面底部。但如果页面解析需要JavaScript,放在最底层就不合适了。

5.减少Cookie传输

在每个响应请求中,如果cookie过大,必然会影响性能,所以不需要把cookie放在网络上,选择数据放在Cooki

公司对优化人员要求,需要不需要会web前端?

对于优化来说,虽然不要求你达到web前端开发设计的水平,但至少要能看懂网页的HTML和css代码,然后对后端的PHP等脚本语言有一定的了解。对于优化来说,不是几年前随便更新文章或者发个外链那么简单。

如果要优化,就得考虑用户体验。对于web前端开发者来说,你关注的是前端的功能和界面的美化设计,但是优化器需要调整代码以符合搜索引擎的标准,从不同的方面提升用户体验。然后就是文章更新和外链发布,这些都算是优化的一部分,叫做外部优化。对于内部优化,需要修改页面布局,精简代码,减少代码冗余。所以优化人员需要了解web的前端知识,只能发布简单的文章信息。目前只能称之为启动子,离优化还有一段距离。

最后,优化人员不仅需要了解文章的发布和web前端代码的优化修改,还需要通过站长平台对网站数据进行分析并制定长期的优化方向计划,并在实施的过程中适当及时的调整优化计划。

浏览器 文件 JavaScript 代码 性能

版权声明:本文内容由互联网用户自发贡献,本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。