純前端表格控件SpreadJS以專一業務、提高效率贏得用戶與市場

提起華爲2012實驗室，你可能有點陌生。

但你必定還對前段時間華爲的那封《海思總裁致員工的一封信》記憶猶新，就在那篇飽含深情的信中，咱們知道了華爲爲確保公司大部分產品的戰略安全和連續供應，打造了無數「備胎」，一晚上「轉正」從幕後走向前臺的海思半導體就是其中之一。而海思半導體就隸屬於華爲2012實驗室下屬的二級部門，其餘二級部門還包括：中央硬件工程學院、研發能力中心、中央軟件院等。

曾有戲言說這個實驗室是中國黑科技最多的地方，也表明着國內最頂級的科研水平。

而就是這麼一個自己科技水平頗高的實驗室，在2018年選擇了純前端表格控件——葡萄城SpreadJS做爲其部門內部表格數據管理的工具。

Why ?

一、小小的控件大大的能量

通常來講，企業的IT部門負責整個企業業務應用程序的開發和部署。而每個新的應用程序及系統的改動，會收到來自各個部門的各類要求，體量不大的IT部門有時候並不能很好很及時的知足這些需求。

最終就會造成，IT部門難以跟上企業的業務，同時身上積壓着超出他們承受範圍的工做等惡性循環。而業務部門等不及就開始本身着手解決問題，他們購買未經批准的現成應用程序或者自行制定解決方案。每每也不符合企業的IT標準，而且常常在組織間或在沒法協同的系統間產生衝突，無形中成爲桎梏企業業務的重大問題。

在這種混亂中，一種減小重複工做，提高效率的工具——控件，悄然興起。

建立控件的最大意義在於封裝重複的工做，其次是能夠擴充現有控件的功能。

通俗的來講，控件就如同帶有魔法的積木同樣，只須要拿起來堆堆疊疊，就能夠作出一輛小車、幾棵植物，建起一座城池。但它又與普通堆積木不一樣，用積木堆的小汽車，再使用時，還須要重複勞動，而控件則能夠隨時隨地的初始化並能夠經過接收參數改變自身屬性（顏色，尺寸等）來使用。

這些控件能給項目開發和軟件交付帶來極大的便利。

而咱們此次的故事的主角——SpreadJS，就是一個賦能開發者的純前端表格控件。SpreadJS能夠幫助開發人員專一於產品的業務邏輯，而不用機械式的經過編碼實現數據基本處理，如增刪改查等。

SpreadJS 是一款基於 HTML5 的純前端電子表格控件，以「高速低耗、高度相似Excel、可無限擴展」爲產品特點，提供移動跨平臺和瀏覽器支持，同時知足 .NET、Java、App 等應用程序中的 Web Excel 組件開發、數據填報、在線文檔、圖表公式聯動、類 Excel UI 設計等業務場景，爲用戶帶來親切的 Excel 使用體驗。

二、開發難度大但實際做用深遠

設計控件是一項繁重的工做。好比它的特性之一兼容Excel就有很大的難度。

兼容 Excel，也能夠稱之爲Office文檔兼容性。

簡單來講就是，若是咱們開發別的軟件，只要把功能實現就好，不論中間怎麼樣。好比播放視頻的軟件只要能播視頻就好，聽音樂的能聽音樂就好。但這個純前端的取代Excel的產品必須可以正確讀取Office Excel文檔。由於Office Excel的市場佔有率過高，若是不能兼容，意味着別人發來的文檔你打不開。想象一下，你之前的文檔，你同事、合做夥伴發來的文檔，你都打不開。若是他們要看你的文檔，得先裝對應的軟件。這就好像你在微信以外，用另外一個全新的聊天工具，你要找朋友聊天，得先讓他們安裝一個新的聊天工具。

而要實現這樣的兼容性，就須要與原有設計(文件格式設計會隱含着原來做者對程序Model的設計)兼容，而Office Excel文檔並非透明的。爲了這個兼容，開發者須要在黑盒模式下各類大膽猜想當心調試，還要承擔「只要有問題就是你的問題」的巨大壓力。同時，揹負上了帶着別人的歷史追趕別人進步的重任。

而在目前 Excel 已有的 480 多種函數公式中，SpreadJS已經支持 450 種以上。

具體講講幾個能夠幫助開發人員在本身的系統中實現Excel的功能：

• 貼近Excel的應用

其實，上面所講的Excel兼容性就是SpreadJS最令筆者驚喜的特性之一。由於不少企業的歷史數據等都是留存在Excel格式的文件中的，這種可以直接導入和導出Excel文件的特色極大的方便了企業對留存數據的存儲、整理和應用。

並且，做爲控件，企業徹底能夠用SpreadJS完美嵌入到本身的OA、帳務、生產等系統中使用，輕鬆的將數據導出爲指定模板的Excel文件，進行復用。在筆者的試用中，不論從頁面仍是功能都與Excel幾乎一致，要不是在Web端，筆者甚至覺得本身在使用Excel。這將極大的減小企業員工的學習成本，極快上手。

而對於開發人員來講，在幫助企業進行業務應用設計時，經過 SpreadJS 提供的相似 Excel模板設計器，能夠輕鬆的設計模板，節約應用程序開發所需的時間和精力。僅用不超過100行代碼，就能夠實現Excel的所有功能，各行業人員都可經過 Excel 軟件製做表格，而後輕鬆導入 SpreadJS 中，提高模板複用性。

「公司的項目管理系統須要使用

SpreadJS 作一個通用的 Excel 模板設計器，將此前自定製的組件經過 SpreadJS 進行集成，用拖拽的方式在 SpreadJS 的表格編輯器界面進行展現和配置，以便生成一套可以自行設計出數據填報、數據可視化甚至是 BI 的 Excel 模板。」

——天津卡達克數據有限公司

• Form表單填報

填報就是提早設計好表單的樣式，在web端展現，分發給別人或者嵌入到別的軟件網頁，來收集數據，方便存入（數據）庫，就像註冊網站填入你的我的信息，發送到後臺，同步到數據庫。

SpreadJS 內置桌面端和 Web 端的在線表格編輯器，支持用戶填報模塊。經過SpreadJS 內置的多種單元格類型，如按鈕、單複選、下拉列表、單元格內的公式引用、數據驗證等均能有效的完成表單相關功能。這種提早設計好報表樣式收集數據入庫，而後導出的方式，能省去不少工做量。

「

SpreadJS 表單控件主要應用於本項目中各種工資表格的展現、編輯和查詢，最後用於彙總生成各種報表並進行展現。咱們的體會是，使用 SpreadJS 咱們能夠輕鬆設計模板，節約應用程序開發所需的時間和精力。無需編碼，財務、人事管理人員都可經過 Excel 軟件設計界面，設計計算公式，而後輕鬆導入設計器或 SpreadJS 中，就可實現模板重用。這大大減輕了工做強度，使得快速開發得以實現。SpreadJS 加載速度快，對內部管理系統無壓力。而且生成報表和網頁打印報表這些麻煩事兒，SpreadJS 都很好的解決了!」

——中國民用航空飛行學院

• Grid表格數據處理

相比其餘電子表格，SpreadJS 提供更全面的內置公式和自定義函數，可針對大數據和複雜計算進行優化，便可爲複雜的公式增長計算能力，又不會過多地佔用系統資源。

並且，在進行數據展現時，不管是自動排序、篩選、行表頭、列表頭、彙總、邊框和單元格樣式等功能，仍是進行分組、查找、聚合、公式等操做，SpreadJS都可知足。

「

SpreadJS 是一個基於 HTML5 技術的純 JavaScript 控件。不但提供了更高的渲染性能和更流暢的界面操做，此外，SpreadJS 經過一個高效的數據模型來快速操做數據，使得載入和操做超百萬行數據變得更爲方便且快捷。」

——中國能建安徽電建二公司

• 數據可視化

在企業進行數據資產管理時，很常見的一個任務就是數據可視化，這樣才能得到關於數據的形象化展現。而SpreadJS 除已徹底兼容 Excel 的 92 種圖表外，還具有了更全面的商業智能分析（數據透視表）和更易於開發使用的自定義擴展能力，並實現了公式的徹底自定義。同時已經實現了諸多類 Excel 的內置形狀，如線條、矩形、箭頭、流程圖，能夠爲前端界面添加更多的細節展示和可視化效果，而且這些內置的形狀均可以無縫的進行導入和導出。而即將在十月份推出的升級版新功能中，也新增了形狀（Shape）、富文本、二維碼以及多個新圖表類型。

「經過

SpreadJS‘可嵌入用戶操做系統，開發在線Excel’的產品概念，以及葡萄城純前端數據處理技術在各領域應用中取得的核心成果，咱們的技術專家無一不對葡萄城SpreadJS 純前端表格控件新穎的設計理念和可靠的產品性能表示讚歎。」

——北京神舟航天軟件技術有限公司

SpreadJS高度相似Excel的在線表格編輯器界面

對於代碼能力不強的開發者來講，僅經過簡單拖拽點擊，就能夠利用SpreadJS方便的實現表格模板設計、數據填報、數據統計、數據管理、數據呈現等功能；而對於代碼能力較強的開發者來講，SpreadJS提供源代碼，方便其進行自由定製和任意擴展。

這也是SpreadJS 得到了衆多客戶承認的緣由。

好比華爲2012實驗室。

三、因此，選擇SpreadJS是意料之中

華爲2012實驗室是華爲技術有限公司的總研究組織，據稱，該實驗室的名字來自於任正非在觀看《2012》電影后的暢想，他認爲將來信息爆炸會像數字洪水同樣，華爲要想在將來生存發展就得構造本身的「諾亞方舟」。其研究領域涉及新一代通訊、雲計算、音頻視頻分析、數據挖掘和機器學習等，重點面向將來5-10年中國工業互聯網的發展方向，不只表明國內最頂級的研究水平，還爲全球高新技術發展產生了源源不斷的推進力。

SpreadJS 在華爲某項目中的應用截圖

提及華爲和SpreadJS的緣起，也有那麼些故事性。

在華爲一年一度的內部產品賽上，一位開發小哥用SpreadJS作了個應用，居然得到了很高名次的獎項，它也所以在內部的論壇和採購平臺上火了一把。接觸並嘗試SpreadJS的部門在使用一段時間後都開始自發安利這個控件，慢慢愈來愈多的部門開始使用SpreadJS。

而SpreadJS固然不會讓他們失望。

首先，SpreadJS幫助他們實現了內部表格數據處理。

華爲2012實驗室的實驗部門遍及全球各地，已經在歐洲、印度、美國、俄羅斯、加拿大、日本設立8個重要的海外研究所。隨着新研究所的創建和各個研究所間數據交流的程度愈來愈密集，創建一整套統1、安全、快捷的數據管理機制顯得格外重要。

不少部門此前重度依賴 Excel 做爲前期調研、資料收集、交換，方案設計 + 審定的核心工具，積攢大量的 Excel 文件須要進行導入導出並現場打印，而用SpreadJS開發出的Web Excel模塊，能夠完美兼容Excel文件，並沒有損導入導出，提高了Excel模塊的複用性和新老系統的遷移工做，同時藉助SpreadJS開發的模塊與Excel UI高度一致，用戶無需學習新系統，便可快速上手使用。

所以，SpreadJS真正無縫兼容Excel文檔且支持Excel格式導入導出的特徵，讓它很好地幫助華爲2012實驗室進行平常維護管理數據。

其次，SpreadJS中大量的公式函數和自定義函數功能，知足了他們的項目需求。

SpreadJS能知足Excel公式的完美兼容，兼具強大的數據聚合能力和跨表格引用、自定義函數的能力。

「簡單的一百多行代碼配合 SpreadJS 的類 Excel 操做習慣，讓咱們的用戶就像使用 Excel 同樣使用內部系統，也爲咱們系統開發完成後的用戶遷移工做節約了大量培訓時間，SpreadJS 優秀的性能讓咱們高枕無憂。」華爲2012實驗室的相關負責人坦言。

純前端表格控件SpreadJS打破傳統代碼編寫方式，將開發迴歸簡捷高效，快速實現用戶需求，解決企業個性化需求與標準化生產的矛盾，讓企業更專一於發展和創新，勢必將成爲將來企業數字化進程中的重要開發工具之一。