二十万行JSP加载缓慢

结论放在前边：

避免在页面的循环结构中使用脚本，尤其是操作页面元素的脚本。能直接在页面元素拼串过程中解决的，不要调用页面方法。

<table>
  <%  for(int i=0;i<length;i++){  %>
  <tr>
    <td>
<!--      一些内容-->
    </td>
    <script type="text/javascript">
<!--      查找获取元素，操作元素属性-->
    </script>
  </tr>
  <%  }  %>
  
</table>

问题过程：

发现问题：

老项目使用的是JSP，有个可变长表是年报，数据量达到千条以上，jsp解析后的html文件有二十万行。最开始以为页面太大导致的页面渲染慢。后来发现另外两个近乎相同的相同行数的页面，数据传输完成后加载的很快，对比发现是少了散布在页面中的脚本，主要是对页面元素的checked属性 和disabled属性进行修改。故，推测性能主要消耗在页面元素的查找和操作中。

解决问题

发现问题根源后，就很好解决了。
在对循环体中，删除各函数调用，将各函数调用的结果直接在页面元素拼串中予以体现。

继续优化

jsp直接在服务器处理，拼接处十万行级的页面，压力较大。尝试改为json传递数据，js代码中拼串使用

$("#tableId").append($.parseHTML(htmlText));

成果

原页面，谷歌十分钟才能解析完成，ie在数据量将近八十时已经崩溃。
现在，谷歌可以在五秒内完成，ie则需要二十多秒。且因为循环元素由浏览器在添加，服务器压力大大减小。

结语：

现在都是前后端分离，vue什么的，这老掉牙的技术早都没人用了吧。写下来留给有缘人吧