36 氪 打开 36 氪,头部和尾部会先加载,然后主体内容在加载,这样做的好处和原理分别是什么呢?
1
newljs 2017-04-14 12:02:47 +08:00
异步加载
头尾是全局模块,本地一次缓存,全站通用,省资源,省流量 而且碰到网速慢的情况不会让人以为网站挂了 |
2
geelaw 2017-04-14 12:34:10 +08:00
这个东西本质和异步没关系,不过 36kr 确实用了异步的方式,如果不想用异步也可以把加载内容的代码放在 body 的最后。
头尾是固定的,中间是动态的,又没有直接 render 出来(容易看见第一次发来的 HTML 没有中间的内容),需要客户端再次请求数据(你会发现这个网站关掉 JS 是用不了的)。好处在于每次访问主页不用重新下载主页的 HTML ,只要从缓存里面拿,然后重新请求真正易变的数据。 此外后面请求的数据是数据本身,而不是 render 好的 HTML ,这样可以减轻服务器拼接 HTML 的麻烦,前端的修改只要改 JS 不用改服务器返回请求的代码,而且这样做是符合 data 和 UI 形式解耦的想法的。 |
3
morethansean 2017-04-14 12:39:38 +08:00
尾部先出来……真的很蠢……
|
4
qhxin 2017-04-14 12:58:53 +08:00 via Android
很讨厌这种内容不能一次性加载完的图文站,还要开 js 才能看
|
5
murmur 2017-04-14 13:03:58 +08:00
不要把这个东西异步什么说的很美
说句简单的就是,卡了 好的,让我们把鼠标移动到中间,调试工具打开,看到了么,有个 div id=app 这就好解释了,反正 36k 用了个 mvvm 框架,主体是中间, header 和 footer 是写死的 html 由于 bundle 太大了,连资源带数据带库中间花了好久才渲染完。。。 |
6
zhangolve 2017-04-17 18:32:04 +08:00 via Android
话说真的是好慢啊。
|