全国咨询热线:

0371-65852003

郑州web前端培训班介绍前端性能优化技巧

发布日期:2020/02/07 17:21:38 浏览次数:70

    我们知道,网站优化是提升网站流量的方法,而一般网站优化都是优化后台,如接口的响应时间、SQL优化、后台代码性能优化、服务器优化等。高并发情况下,对前端web优化也是非常重要的。下面红狐郑州web前端培训班小编就为大家介绍一下前端性能优化技巧:


    1、减少HTTP请求数:


    (1)避免重定向:重定向就是说明需要客户端采取进一步操作才能完成请求,请求时间就会延长。所以输入URL时应使用最完整的、最直接的地址,比如输入www.zzhonghu.com而不是zzhonghu.com。


    (2)使用缓存的机制:主要有数据库缓存、服务端缓存(反向代理和CDN缓存)、浏览器缓存。


    2、图片懒加载


    页面的图片非常的多,可以使用懒加载。只加载第一屏的图片,当用户通过滚动访问后面的内容时再加载相应图片。方法是先用一张极小的占位图代替图片,占位图只下载一次,将原本图片的src存储在另一个属性中,判断当图片快进入可视区域就将路径赋值给src并下载图片进行展示。


    3、代码的优化


    (1)页面的结构:CSS放在HTML内容上部,JavaScript放在HTML内容下部。可以使用preload提前解析资源的DNS。由于浏览器是自上而下读取内容的,因此放置资源的位置会影响网站的访问速度。比如,如果将script标签放在HTML内容的前边,浏览器就会先调用JavaScript解释器对JS进行解析,完成之后才会渲染其余的HTML内容,对用户来说,能看到的是HTML的内容,所以(1)这么做会导致页面可用性的延迟。另外,CSS是对页面节点进行修饰的,如果CSSOM未构建之前就进行了布局,等到CSSOM构建出来,如果CSS修改了节点的布局,就会发生重排,需要重新计算布局并绘制。


    (2)JavaScript优化:比如减少对DOM的操作,减少重排和重绘,减少作用域链查找,慎用eval函数等等。JS代码和(下面的)CSS的优化主要要求前端开发人员对页面渲染原理有清晰的了解、对基础知识的掌握和良好的编程习惯。


    (3)CSS优化:比如减少使用通配符‘*’,提取公用样式增强可复用性,选择器准确可减少匹配时间,适度使用内联样式。


    红狐企业网通过完善的服务体系全面帮助企业迅速推行客户战略,我们的产品及服务定位于中国企业的互联网+应用。通过我们多年对企业信息化开发及应用服务的经验,我们已在互联网研究、设计、推广、市场营销、咨询服务等方面都具有卓越能力。现红狐推出了郑州web前端培训班,面向全国招生,可以让学员边工作边学习,毕业既有工作经验。各位想要参加培训的学生可以直接拨打公司客服电话报名哦!


  1. 上一篇:郑州web前端培训班介绍Web前端需要会哪些?
  2. 下一篇:郑州web前端培训班介绍2020年Web开发的趋势

红狐企业网-专注于IT行业服务教育—您成功路上的垫脚石!

15年企业IT行业服务,值得信赖/15 years of enterprise IT industry service, trustworthy

河南省郑州市金水区农业路东1号(豫博大厦西塔511室)

0371-65852003/66110309 13526898517

123434446@qq.com

扫一扫加关注,获得更多资讯

Copyright©2018-2019 红狐企业网IT培训中心 www.xxxxxxx.edu.cn 版权所有 All Rights Reserved 豫ICP备16004903号-5