天猫首页首屏数据来源

Question

我在研究天猫首页的代码,感觉它的首屏数据并不像是ajax加载的，所以我想问一下，它的首屏数据是利用什么方式加载的？

比如:

window.g_config.serverTime = 1496370628991;   // "1496370628991"这个数字每次刷新都是变化的

<div id="J_defaultData" style="display:none;"> ………… </div> // 这个div(div中的json数据太长，所以省略了)里面的数据查看源代码的时候就有,并不像是ajax请求的。

下图是div中的数据

Answer 1

研究了一下午，大概是明白了，天猫首页在服务端使用node做的，所以html渲染的时候就会把数据带上。楼上说的比较对，这种查看源代码就有的数据肯定是服务端直出的。不知道的同学可以搜索一下同构渲染，就是同一份js代码，先在服务端完成页面结构和数据的渲染，然后给到浏览器，浏览器只执行一些事件绑定相关的东西，这样的话会大大提高首屏的加载速度。现在前端最火的vue和react都有相关的服务端渲染的功能。

Answer 2

阿里都是采用的fetch技术加载的，并不是采用的ajax。

Answer 3

没研究过，目测是服务端直出

Answer 4

模板引擎
变量替换

Answer 5

可以去看下和服务器端渲染有关的东西。。为了提高首屏的渲染速度。。不管是用PHP或者是nodeJS，都是可以服务器端渲染的

Answer 6

https://developer.mozilla.org... fetch的API

Answer 7

反对上面说fetch获取的，fetch也好，ajax也好。都可以在network里看到请求的发送，但是首页显然没有。