页面加载出现白页是什么原因造成的
1、页面加载时,有较长时间的白页,有可能是什么原因造成的?
在日常开发中,会发现浏览器白页情况会偶尔出现。这是怎么一回事?我们又该怎么去分析在哪里出现了问题?接下来我们一探究竟。
为了更好的发现问题,解决问题,我们将从三个方向来说明白页问题:客户端方向,服务端方向以及网络方向。
客户端方向
- JavaScript 异常
由于 JavaScript 出现的问题导致了页面白页。那么那些情况下 js 报错 会影响到页面白页呢?
a.在头部加载 JavaScript。头部加载 JavaScript 在解析 JavaScript 时报错,页面就会停止,所有的内容不会正常的展示出来。导致页面白页。所以要避免出现头部加载 JavaScript 的情况。
b. 资源的加载顺序。资源的加载顺序决定了页面的逻辑能否正常的 执行,当页面加载顺序出现问题导致页面无法正常执行,最终导致 白页现象。或者网速较慢,下载相关资源很慢,这时就会出现暂时
的空白页的现象。 - 客户端请求异常 由于在客户端发送的请求异常导致页面空白,哪些请求可能导致页面 空白呢?
a. 无效请求。 当我们发送无效的请求时,服务器不会返回相应的内容, 直接导致我们的页面无法正常展示,最终以空白页的形式展 示
b. 错误路径(错误请求)。 当我们去访问服务器中的错误路径时, 服务器无法返回正常的请求资源,最终导致页面无法正常显示,最 终也是以空白页形式展现。
服务端方向
反向代理服务器异常。 反向代理服务器出现问题。当我们访问的请求打到代理服务器上。代 理服务器出现了问题。无法正常解析路径等操作。同样会导致页面白 页情况。
服务器异常 服务器的资源无法正常找到,会出现服务器异常,最终出现空白页现 象。服务器宕机也就是服务器死机了也会导致服务器异常,无法正常处理我们的请求最终体现在客户端的是空白页现象。通常会报出 502 错误。
正常情况 服务器就正常返回了一个空白页面(滑稽脸),这种情况也是可以发生的。
网络方向
DNS 解析异常
出现无法解析服务器的 DNS 地址的问题。先了解一下 DNS,简单说就是将域名转换为 IP地址功能的服务器。DNS 解析不了,输入的地址自然无法指向目标网络,就无法上网了。这时任何请求都是无用的,最终导致浏览器白页现象。
链接超时 当我们请求的资源比较大,并且在服务当中设置的链接时常,在网速较慢的情况下,无法下载完页面资源,导致页面无法正常执行,最终导致 出现页面白页现象。
CDN 服务器异常
对于 CDN 服务器异常,可能是 CDN系统的错误提示,比如源服务器 异常,还有可能是使用了 CDN 系统的软件探测到 CDN 服务商异常, 比如 CDN 节点故障,以上的 CDN 服务器异常都会导致,在 CDN 服务器上的资源无法正常的进行,加载,导致页面无法正常展示,最终导 致白页现象。
页面加载出现白页是什么原因造成的相关推荐
- html加载时页面闪烁白色背景,解决页面加载闪白问题-背景图片加载优化
页面加载闪白 今天遇到一个问题,写了一个使用深色背景图的网页,发现访问/刷新时,会出现短暂的闪白现象. 之前使用浅色背景时没有发现过这个问题,搜索半天也没有找到特别直白有效的回答. 找到的几个答案,有 ...
- 前端页面加载缓慢的原因和性能优化问题
前端页面加载缓慢的原因和性能优化问题 一.页面加载缓慢的原因 二.前端性能优化方法 一.页面加载缓慢的原因 当我们打开一个网页,页面加载比较缓慢时,可能原因有以下几点: (1)过多的http请求 (2 ...
- android 下拉刷新数据,如何剥离Android页面下拉刷新、加载下一页等逻辑?
最近碰到一个新的页面控制需求:下拉刷新如果失败,listview上面的数据需要保留,然后悲剧的发现之前写的NetFragment和ListNetFragment都不能覆盖这种逻辑,又要重写了.痛定思痛 ...
- html超出高度自动下一页,上滑web页面自动加载下一页
移动端常常是通过向上滑动到页面底部自动加载下一页内容,而不是点击"下一页"按钮进行加载.这是一个演示了自动加载下一页的小demo. html: html> 向上滑动自动加载后 ...
- html页面css3滚动加载,aos.js-网页滚动加载动画的jQueryCSS3动画库
aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态. MIT许 ...
- html页面判断其他div为空,将外部html加载到div中 - 页面加载然后变为空白
我确信这将会变成一件愚蠢的事情,但是自从我成为JavaScript noob以来,这里就变成了一件愚蠢的事情.将外部html加载到div中 - 页面加载然后变为空白 我想外部HTML内容加载到我的索引 ...
- html5 页面加载缓慢,html5体验优化页面加载的14条建议
html5体验优化页面加载的14条建议 1. fake 页 - 首屏加速 目标:首屏 3s 以内 因为 71% 的用户期望移动页面跟 pc 页面一样快 (3s) ,74% 的用户能容忍的响应时间为 5 ...
- 新闻页面_页面加载功能设计总结
♝点击上方"交互设计学堂"关注我们,送电子书 关于"前进",我们很难给出一个准确的定义.狭义上的"前进"指的是用户触发某个交互动作进入一个新 ...
- html加载完成 产生动作,页面加载功能设计总结
关于"前进",我们很难给出一个准确的定义.狭义上的"前进"指的是用户触发某个交互动作进入一个新页面.如何在进入一个新页面的过程中给予用户良好的体验呢?我们可以从 ...
- 页面加载更多的css,十种加载样式
原标题:十种加载样式 对于设计师来说往往更多的是注重界面的设计,从而忽略了用户对于加载等待的体验,如何用不同的加载来缓解用户的等待焦虑,从而提升用户对产品的体验呢?下面就来和大家介绍一下都有哪些加载样 ...
最新文章
- 在linux内核中获得比jiffies精度更高的时间值【转】
- java程序实验总结_Java Socket 编程实验总结
- GitHub高效搜索
- Tensorflow中padding的两种类型SAME和VALID
- pku 3020 Antenna Placement
- 数据结构与算法笔记(十一)—— 归并排序
- centos安装包选择--liveCD、liveDVD、bin-DVD、netinstall和minimal
- 计算机二级循环储存,【日常干货】计算机二级基础知识(第三期)
- 从零开始山寨Caffe·零:必先利其器
- [golang]nil slice和empty slice的区别
- 优酷背后的大数据秘密:资源弹性,可支撑EB级存储
- 大二生活之致给影响我最大的大学老师,我和老师的一些事
- C++参考的翻译或校对
- Linux学习之CentOS(三十二)--Linux系统服务基础
- Ubuntu 安装tftp服务器
- 解决Please define the NDK_PROJECT_PATH variable to point to it.
- 小知识--Windows10许可证即将过期
- 第三人称和第一人称互相切换【Low版】
- Linux中gcc4.8.5升级到gcc5.4.0用已经编译好的安装包升级(重点是不用编译安装,可以更省时)
- npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree