原因

最近，在優化之前公司幫聯想（外包）做的一個老的後臺管理系統，由於項目是基於easy UI框架，頁面是後臺用jsp實現的，再加上在公司推行前後端分離的實踐，大部分項目都基於vue采用前後端分離去實現。所以當後臺哥們兒告訴我，某個用datagrid渲染的表格，加載時間長達30多秒，讓我去優化的時候，我的內心是崩潰的，但是我是沒法拒絕的，誰讓我們搞前端的呢！

過程

說幹就幹，從svn上更新下代碼，便開始搞起。頁面渲染過慢總體分兩種原因，後端接口傳輸速率慢和前端頁面渲染慢，當然先從接口下手，取到後臺接口，放在postman中模仿前端發送請求發現秒返回數據。......那麽很明顯問題不在後臺了。確定問題在前臺了，首先到easy UI官網查看datagrid的API文檔，確定代碼語法沒有問題，接下來就是用瀏覽器搜索了，上網查了下給出的解決datagrid大數據渲染緩慢的方法，要麽是版本不一樣，要麽就是沒效果。但是有一個方法，通過設置rownumbers=false

完美解決

本來已經絕望了，感覺問題應該是框架設計的bug，只能修改源碼了，但是，我不死心一邊翻看文檔，一邊尋找可能的解決辦法。無意中看到，datagrid表格渲染會通過計算表格元素寬度，取出最寬的表格，對列寬負值。我靈機一動我們渲染的表格列數達到了30列，官方的示例都在10列左右，難道是要設置固定列寬（width），來降低表格計算寬度消耗的時間。我確定就是這個原因，立刻修改代碼，提交svn，後臺重啟服務器，重新測試了一下，從之前的將近30多秒，現在2秒左右。問題完美解決！

easyUI datagrid 多行多列數據渲染異常緩慢原因以及解決方法