实现数据逻辑与业务的解耦，模板文件填入你需要的数据，框架自动去请求相关数据

/*
并发加载函数
id：唯一值
syncFunc：加载函数
 */
const _map={}
const _startTimeMap={}
async function conCurentLoad (id,syncFunc) {
  //兼容并发加载的情况
  if(!_map[id]){
    _map[id]=[];
    _startTimeMap[id]=+new Date();
    const res = await syncFunc();
    setTimeout(function () {
      if(_map[id].length>0){
        _map[id].forEach(function (callback) {
          callback(res)
        })
      }
      delete _map[id]
    },0)
    return res;
  }else{
    const now=+new Date();
    //10秒超时处理
    if(now-_startTimeMap[id]<10000){
      return new Promise(function (resolve) {
        _map[id].push(resolve)
      });
    }else{
      return syncFunc();
    }
  }
}
//加载组合数据
async function loadGroup(data) {
  if(typeof data==='object'){
    for(let k in data){
      if(Object.prototype.toString.call(data[k])==='[object Promise]'){
        data[k]=await data[k];
      }
      if(typeof data[k]==='object'){
        data[k]=await loadGroup(data[k])
      }
    }
  }
  return data
}
//定义
function defineModal(data,_ajax){
  //唯一标识
  let id=Symbol('id')
  return new Proxy(data, {
    get(target, key) {
      if(target.hasLoad||target.hasOwnProperty(key)){
        return target[key]
      }
      return conCurentLoad(id,async function () {
        const data=await _ajax()
        Object.assign(target,data)
        target.hasLoad=true;
        return target
      }).then(function () {
        return target[key];
      })
    }
  })
}
//定义有请求的数据源
const User =defineModal({
  name:215
},function () {
  return new Promise(function (resolve) {
    setTimeout(function () {
      resolve({
        name:'user',
        list:[
          {
            a:'a'
          }
        ]
      })
    },100)
  })
})

//Page modal
let Page = {
  page:User.list
};
let Tmp = {
  page:Page
};

async function init(){
  const data={
    TmpPage:Page.page,
    Tmp
  }
  //从模板中读取到的字符
  const tmpStrs=['Tmp.page','TmpPage']
  const func=new Function('data', `with(data){return [${tmpStrs.join(',')}]}`)
  const arr=await loadGroup(func(data))
  console.log(arr)

  console.log(User.name)
  //接口模式
  // const name=await loadGroup({
  //   name:Tmp.page.page,
  //   name2:User.list,
  //   arr:[{
  //     d:User.name
  //   },User.name]
  // })
  // console.log(name);
}

init()

//加载模板，解析出数据源

//处理数据源，返回数据

//渲染页面或者json