京东等等，为何不直接绑定页面数据，而是用js var data=[]...定义然后将数据绑定在页面上。
前后端分离？
性能优化？
像京东淘宝这类大型网站，数据的读取都是很复杂的，不是简单的从一个接口读取。主要大概数据分为下面几种
直接读取数据
直接从服务器读取最新数据。只有一部分数据会这样做，因为对服务压力太大。这一步可能是服务端渲染。缓存数据
如果从服务端读取最新数据失败，或者实时性不强，不需要读取最新数据，则使用缓存数据。以减轻对数据库的压力。-
容灾数据
如果机器突发故障，或者程序崩溃，直接读取数据和缓存数据全部失败，则使用容灾数据。容灾数据一般是成功读取前两种数据成功后localStorage或者userData保存到客户端的。即使服务器端发生故障，页面也能正常显示。只是有可能不是最新数据而已。所以像淘宝京东这种，即使出现故障。也不会影响用户浏览（可能会影响操作）。
所以只看题主图片很难分析为什么要这样使用。
把渲染放到客户端，减轻服务器压力