通过ajax优化页面加载速度

最近在做的一个外包项目，由于客户的要求，首页内容十分繁杂，并且由于客户需求的变更，导致初期的设计不够合理，调用了大量的后台服务，首页两三秒才能加载出来，重新调整服务又太麻烦，基本上是重构了。。。
优化方式就是把一些次要的信息全部写成json接口，通过ajax在页面加载之后异步调用。首页打开速度明显变快。其他信息也慢慢加载出来，不影响用户浏览使用。

具体做法：

<script type="text/javascript">
var parames={
      "areaId":"${as.areaId}"
};
$.ajax({
       url:'${ctx }/search/name',
       type:'post',
       dataType:'text',
       data:parames,
       error: function(){
                 console.log("获取地域信息失败!");
       },
       success:function(data){
                $("#${as.areaId}s").html(data);
       }
 });
</script>

此段js写直接在页面上的 <c:forEach>标签内，相当于每个列表的元素下面都加了这么一段js，而且元素的id是由后台返回的动态id，因此页面上的元素都可以获取到要显示的内容。

比较向往前后端分离的思想，不过暂时没法在项目中用上，对前端的要求比较高，不过偶尔用ajax这样救救火还是挺不错的！