当前位置:网站首页>【测试面试题】页面很卡的原因分析及解决方案
【测试面试题】页面很卡的原因分析及解决方案
2022-07-07 21:47:00 【小梧敲代码】
最近市场行情,很多小伙伴有被动跳槽的打算,最近小编会主要更新一些相关的面试题,希望能帮到大家。
其实很多面试官问一些问题,主要是想考察候选人的逻辑思维能力以及表达能力。测试新手因为测试经验不够丰富,往往容易漏掉一些要点,所以建议大家面试前一定要做好充足的准备。
具体操作其实就是多刷面经,碰到一些常见问题时,先不要着急看答案找答案,而是先想想如果是自己会怎么答。
试想一下,如果面试官恰好问到了你复习过的题目,是不是能帮你提升面试成功率?
Tip:如果碰到准备过的题目,不要一骨碌马上全部说完答案,要展现出你思考的过程,一方面不要让面试官感觉你像背的题目,没有自己的理解;另一方面自己也可以想看看有没有遗漏的要点。
话不多说,关于页面很卡的原因分析及解决方案如下:
原因一:http请求次数太多
解决:减少http请求次数。
① 图片地图:把多张图片整合到一张图片中,以位置定位超链接。
② CSS Sprites合并图片,通过指定CSS的backgroud-image和backgroud-position来显示元素。
③ 合并JS脚本和CSS样式表。
④ 使用外部JS和CSS文件。
原因二:接收数据时间过长,如下载资源过大
解决:对HTTP传输进行压缩。
即在js,css、图片等资源已经压缩的基础上,在HTTP传输过程中的再次压缩。
客户端可以通过Accept-Encoding头来声明浏览器支持的压缩方式,服务端通过Content-Encoding来启用压缩,配置压缩的文件类型,压缩方式。gzip使用无损压缩,压缩效果最佳,已经成为使用最为普遍、支持的浏览器最多的数据压缩格式。
原因三:JavaScript脚本过大,阻塞了页面的加载
解决:将JavaScript脚本放在标签前。
script没有async和defer时,JS文件将在下载后立即执行。这种情况下,script放在顶部会阻塞页面呈现,在网速慢的情况下会导致“白屏”,直到脚本下载完毕才继续呈现页面。
因此,script放在底部可以让页面尽快呈现。
https://blog.csdn.net/zhouziyu2011/article/details/71330739
原因四:CSS、JavaScript、图片等需要重复加载
解决:静态资源统一放在一个静态域名上,减轻重复下载静态资源的负担。
原因五:cookie影响
解决:减小cookie的影响。
① 去除没有必要的cookie,如果网页不需要cookie就完全禁掉。
② 将cookie的大小减到最小:减小HTTP请求报文的大小,提高响应速度。
③ 设置合适的过期时间:cookie信息将存储到硬盘上,即使浏览器退出cookie还会存在,只要cookie未被清除且还在过期时间内,该cookie就会在访问对应域名时发送给服务器。
④ 通过使用不同的domain减少cookie的使用:cookie在访问对应域名下的资源时都会通过HTTP请求发送到服务器,但在访问一些资源,如js,css和图片时,大多数情况下cookie是多余的,可以使用不同的domain来存储这些静态资源,这样访问这些资源时就不会发送多余的cookie,从而提高响应速度。
原因六:网页资源过多
解决:使用CDN部署网络以提高下载速度,可以先通过免费的CDN供应商来分发网页资源。
原因:DNS解析速度
DNS解析是从域名到IP的解析。DNS解析包括往复解析的次数及每次解析所花费的时间,它们两者的积即是DNS解析所耗费的总时间。许多人无视了DNS解析的因素,其实它对网站解析速度也是十分重要的。可以更换延迟比较低的DNS服务器。
最后感谢每一个认真阅读我文章的人,下面这个网盘链接也是我费了几天时间整理的非常全面的,希望也能帮助到有需要的你!
这些资料,对于想转行做【软件测试】的朋友来说应该是最全面最完整的备战仓库,这个仓库也陪伴我走过了最艰难的路程,希望也能帮助到你!凡事要趁早,特别是技术行业,一定要提升技术功底。希望对大家有所帮助……
如果你不想一个人野蛮生长,找不到系统的资料,问题得不到帮助,坚持几天便放弃的感受的话,可以点击下方小卡片加入我们群,大家可以一起讨论交流,里面会有各种软件测试资料和技术交流。
点击文末小卡片领取 |
敲字不易,如果此文章对你有帮助的话,点个赞收个藏来个关注,给作者一个鼓励。也方便你下次能够快速查找。
自学推荐B站视频:
零基础转行软件测试:自学完软件测试,拿到了字节的测试岗offer,堪称B站最好的视频!
边栏推荐
- Gazebo import the mapping model created by blender
- Form组件常用校验规则-2(持续更新中~)
- Revit secondary development - cut view
- 行测-图形推理-8-图群类
- Leetcode206. Reverse linked list
- Basic knowledge of linked list
- Debezium系列之:源码阅读之BinlogReader
- 6-3 find the table length of the linked table
- Write in front -- Talking about program development
- Amesim2016 and matlab2017b joint simulation environment construction
猜你喜欢
随机推荐
The free styling service of Dyson's official direct store is now open for appointment. Pioneer Technology interprets the styling concept of hair care and helps consumers unlock diversified and shiny s
Xcode modifies the default background image of launchscreen and still displays the original image
Basic knowledge of binary tree
Revit secondary development - modify wall thickness
Revit secondary development - cut view
How to judge whether the input content is "number"
7-51 combination of two ordered linked list sequences
Yarn开启ACL用户认证之后无法查看Yarn历史任务日志解决办法
Aspose. Words merge cells
Remember an experience of using selectmany
Cataloger integrates lidar and IMU for 2D mapping
Details of the open source framework of microservice architecture
Cannot find module 'xxx' or its corresponding type declaration
行测-图形推理-5-一笔画类
Debezium series: introducing support for the final operator
ASEMI整流桥KBPC1510的型号数字代表什么
Basic knowledge of linked list
7-18 simple simulation of banking business queue
Take full control! Create a "leading cockpit" for smart city construction
Line test - graphic reasoning -7- different graphic classes