場景：

1. 在許多用戶的實際應用場景中，常常需要加載幾種表單：1)數據量大；2)公式多且復雜。在這些常見的場景中往往需要較多的時間去加載表單，導致每次都需要等待較長的時間，用戶體驗較差。
2. 需要做大量的繪制操作時，表單出現“假死”的情況。
3. 較大數據量的表單下，需要將全部單元格進行自適應。

場景1的優化：

1. 對于表單的性能表現，我們也在不斷地優化，每個版本我們也會針對一些典型的用戶場景進行優化，所以新版本會相對于前面的版本性能會有所提升。例如，同一份表單在v11和v14的加載速度也會有所不同。因此，當我們使用的版本相對較舊時，最直接的方案就是升級產品版本。
2. 無論是導入Excel還是導入json，其本質都是調用fromJSON將表單反序列化。在默認情況下，為保證數據完整和正確，SpreadJS會自動重算所有公式。因此我們可以通過下面幾個屬性來優化記載性能。
   1. 在fromJSON的時候，設置doNotRecalculateAfterLoad以及incrementalLoading這兩屬性，前者可以告知SpreadJS，不需要在導入后執行重算。開啟了這個屬性也不用擔心，因為正常情況下，無論是Excel還是SpreadJS，公式計算默認都是實時生效的，因此在導入文檔時文檔數據已經是統一并正確的。后者是v14新增的屬性，名為增量加載，通過改屬性將在后臺加載值和公式時快速顯示數據，減少用戶的首屏等待時間。可以參考學習指南。

參考下面的代碼為

spread.fromJSON(workbookObj, {
doNotRecalculateAfterLoad:true,
incrementalLoading: true
});

由于前端性能的限制，在一些比較極端的情況下（百萬級別甚至千萬級別的公式樣式），即使用Excel打開都需要花費大量的時間，那么我們只關心最后展示的數據，可以用下面的屬性將樣式和公式忽略掉。

spread.fromJSON(workbookObj, {
ignoreFormula: true,
ignoreStyle: true
});

1. Workbook的calcOnDemand配置：使用如這句代碼所示spread.options.calcOnDemand = true;設置這個屬性后告訴計算引擎，按需求執行計算，而不是每次有數據改變都重算所有的公式，同時可以配合上面的option一起使用。

場景2的優化：

對于需要一次大量繪制的情況，可以使用suspendPaint / resumePaint函數來加速渲染性能。

場景3的優化：

在這種場景下，與繪制不一樣的是，AutoFitRow應該考慮所有可見和不可見的單元格，然后獲取getText（getValue+format），考慮SPAN，考慮高優先級選項，以及很多復雜的邏輯，在目前沒有太大的空間來提升。在這種情況下，一次自適應大量的單元格，這確實需要花費較多的時間。根據數據集的大小，越大的數據集也會花費更多的時間。但是，如果只是需要顯示的時候自適應可以使用附件的workaround。

SpreadJS | 下載試用

純前端表格控件SpreadJS，兼容 450 種以上的 Excel 公式，具備“高性能、跨平臺、與 Excel 高度兼容”的產品特性，備受華為、蘇寧易購、天弘基金等行業龍頭企業的青睞，并被中國軟件行業協會認定為“中國優秀軟件產品”。SpreadJS 可為用戶提供類 Excel 的功能，滿足表格文檔協同編輯、 數據填報、 類 Excel 報表設計等業務場景需求，極大的降低企業研發成本和項目交付風險。

本文轉載自