0.从何说起
昨天,领导给了我个任务,让我查一下网站首页加载慢
1.看了一下 network 里面的请求
- 打开首页的时候,所以资源都加载了,就算是页面底部 用户没看到的图片
- index.html 里通过 cdn 加载了
slick的两个 css 资源(但是已经安装了对应的 npm 包,因此将其移除) - 一个麻烦的 polyfill, 整整 15 秒,都没加载好,然后网页一直是白屏...............
2. 书接上回
<script src="https://cdn.polyfill.io/v2/polyfill.min.js" ></script>
查了下 git 的 log,上个大哥引入这东西是为了修复IE11的问题,(我再次战术后仰) , (这都 2211 年了,ie 还活着呢.)
吐槽归吐槽,事情还得干,cdn 的事情好整,cdn 这么多,换个国内的不就得了.
3. 国内的 polyfill相关的 cdn
百度上一搜 很快啊 出来一堆
找了个 bootcdn 去一搜, 什么babel-polyfill , js-polyfills ...,两个都试了一下,
(由于我电脑上没 IE,每次都需要部署到测试环境,然后拿另一台 windows 来测试,)
发现和 polyfill.io 显示效果都有差异, 然后又搜了一下国内的 cdn
4. 悲剧
都试了一下,嗯, 果然 出乎我所料, 都和 polyfill.io 有差异, (我人傻了...)
然后仔细了解了一下 polyfill.io的 cdn,发现用的 fastly 的服务,(Holy Shit),
权宜之计
想起来前端八股里的 defer async 了, 具体干嘛的 有点忘了...
全部加上去. 似乎 大概 也许 可能 maybe 解决了这个问题吧.
