问题描述

这是一个新旧框架结合的组合页面；左侧是列表页，右侧是详情页；列表页使用的是vue；详情页使用的是jquery；

第一个请求耗时比较久，有差不多7s，阻塞了其他的请求；

第一个请求，请求的是html页面，有点服务器渲染的意思只有第一个请求返回会，再会加载其他的css、js、imgs、xhr；

将后端比较耗时的一个获取历史列表数据单独为第2个请求；该请求返回的是一个html页面，通过php的display装载数据到指定的html页面模版中；返回的html页面通过append插入到详情页中；
为什么第2个请求返回的是一个html页面，而不是一个数组数据？如果是数组数据，因为使用的是jquery；没有vue的那种v-for指令，需要写一大堆新增dom的js，感觉好繁杂。所以直接请求一个页面，通过php的display装载好数据后，直接嵌入。
第2个请求会不会阻塞详情页的渲染呢？

iframe缺点是切换页面需要重新加载所有的css、js

<script type="text/javascript" src="***.js?v=<?php echo filemtime($_SERVER['DOCUMENT_ROOT'].'/Public/Js//common.js') ?>"></script>

新的问题是：请求的html中的js没有执行。解决办法是将js写在单独的js文件中，在外层（及ifame的外面）引入该js文件，再调用相关的js。解决方式改动较大也不太兼容iframe内嵌页面单独展示，顾放弃。

每切换一次加载一个新的详情页，每个详情页会发送2个ajax请求；chrome浏览器每个域名下可以并发6个tcp；频繁且快速的切换会导致ajax请求排队；可以将ajax请求保存都一个变量中；当离开页面时（beforeunload）可以取消ajax请求；

var ajaxGet = $.get(“comet_server.php”,{id:1},function(data){
    
});
ajaxGet.abort();