前言
由于浏览器的并发机制导致了一个bug，排查了一下午才解决掉。感觉挺有意思的，拿出来和大家分享一下。
问题描述
项目已经接近尾声了，开始最后的回归测试环节。遇到了一个诡异的bug，测试说他在公众号测试的时候发现在页面返回的时候偶尔会白屏，然后返回到首页的时页面会一直处于加载中。
我听他描述，我就知道这个问题好改不了，返回后页面白屏，主要他说还不是必现的。第一时间想到的就是手机兼容性问题，是不是返回后手机自带缓存，返回后没有自动刷新页面，一系列想法油然而生。
有了想法就先用他手机试了试，复现一下才能确定问题，开始快速的进入了几个页面，然后返回没有问题。又连续点击了几个，然后返回还真复现出来了。确实是进入到了白屏页面，再返回到工作台首页会一直处于loading状态。
之后又用自己的手机和电脑试了试均能复现出该问题，此时已经明确不是兼容性的问题。
随后打开f12，多次复现bug，发现规律。总是在第7个页面的时候发生白屏和加载中loading，查看网络请求发现下图的情况。
由于项目本身没有设置ico图标，浏览器会自动的发送一个请求。以获取网站的图标。如果该请求未能及时完成，浏览器会一直保持请求状态，并在每次页面切换时重新发送请求。浏览器通常对同一个域名下的并发请求数量有限制，当出现多个请求中的 favicon.ico 时，就会达到浏览器对同时进行的请求数量的限制。超过限制的请求会被浏览器阻止从而无法发送到后端。这也就导致真正页面需要的数据在后面排队，页面在mounted里面开启了加载中的loading，但是迟迟拿不到结果就一直处于加载中的状态。至于为什么白屏，是因为有的人直接在页面的顶部写了一个v-if，请求数据到数据之后才会渲染页面。。。
解决问题
知道了问题发生的原因解决起来当然也非常简单，在public里面加入一个文件favicon.ico ，一个空文件即可。然后在index.html中通过link引入图标。这样就可以拿到图标，使请求成功了。问题就解决了。
总结
之所以会有这个并发请求数量的限制是为了平衡网络性能和资源利用的考虑，以避免对服务器和网络造成过大的负担。这个数量限制是对同一域名下来说的，一般来说，现代浏览器的最大并发请求数量通常在 6 到 8 个之间。谷歌浏览器好像是6个。如果网页中有大量的资源需要加载（例如图片、样式表、脚本等），并发请求数量的限制可能会导致资源加载时间延长，从而影响页面的加载性能。优化资源加载顺序和合并请求可以帮助减少并发请求数量，提高页面加载速度。或者使用HTTP/2，它引入了多路复用功能，可以通过单个 TCP 连接并发地发送多个请求和响应。这意味着 HTTP/2 可以在一个连接上同时处理多个请求，而不受浏览器的并发请求数量限制。
刷面试题的时候看到过问浏览器并发请求数量的问题，当时觉得是纯纯的八股文。结果今天还真碰到了并发请求数量导致的问题，基础还是很重要的，书到用时方恨少啊。
以后遇到类似问题，又多了一种排查问题的思路。
希望大家都有所收获！