SpreadJS + GcExcel 一出,谁与争锋!全栈表格技术轻松应对复杂公式计算场景(一)
设计思路篇
Excel是我们日常办公中最常用的电子表格程序,不仅可满足报表数据的计算需求,还可提供绘图、数据透视分析、BI和Visual Basic for Applications (VBA)宏语言编程等多项功能。经过数年发展,Excel已具备所有电子表格的基本能力,在满足统计、工程和财务领域的各项数据分析需求的同时,还取代了Lotus 1-2-3成为电子表格的行业标准。
Excel的命名源自于英语中"Excellence"一词,代表着:卓越和优秀,而最能体现其"卓越和优秀"的点就是Excel的公式与函数。Excel 的公式函数使得本身静态的表格真正"活"了起来。
如果说Excel是基于"公式与函数"的特性,成为了职场精英高效工作必备的神兵,那么纯前端表格控件 SpreadJS 也正是依靠这一特性,成为了开发者快速开发企业Web应用的利器。
SpreadJS是葡萄城研发的一款基于 HTML5 的纯前端表格控件,兼容 450 多种 Excel 公式,具备"高性能、跨平台、与 Excel 高度兼容"的产品特性,备受华为、明源云、远光软件等知名企业青睐,被中国软件行业协会认定为"中国优秀软件产品"。借助SpreadJS的组件功能,开发者得以将Excel搬到了线上的网页中,使应用程序具备在线Excel 的能力。

视频: https://videos.grapecity.com.cn/SpreadJS/online/SpreadJS_Introduction.mp4
在2021年之前,基于浏览器的Web 应用的确可以满足企业大部分需求,但随着 Web 3.0的推出,以及万物互联与元宇宙等新兴概念的出现,应用程序极致的性能与用户体验开始逐步替代程序功能本身,并有望成为未来Web系统的"标配"。
不过,受限于浏览器内存本身,前端组件的性能瓶颈无法避免。为此,葡萄城提出了"类 Excel 全栈解决方案"来解决这一问题。
SpreadJS + GcExcel 构建类 Excel 全栈解决方案
由于前端资源的限制,当我们去加载一个包含大量计算公式的Excel时(例如地产行业的投资管理模型、金融保险行业的金融精算表格、生产制造业的设计底稿等),表格加载缓慢、程序未响应,甚至崩溃的问题时有发生。
这些Excel的共同特点是:公式数量在10W~20W以上,表格包含大量逻辑复杂且互相嵌套的公式函数,如果仅依靠JS组件和浏览器处理这些文档,显然会捉襟见肘。然而,如果将它们放在后端服务器上执行,即不会影响到用户体验,又能明显优化前端性能,实现前后端负载均衡,这便是SpreadJS + GcExcel 构建类 Excel 全栈解决方案的设计初衷。

利用 GcExcel在服务端的性能优势,将其与纯前端表格控件SpreadJS双剑合璧,即可满足在线文档数据同步、在线填报、批量导出与打印,以及类 Excel 报表模板设计与服务端高性能处理等功能。
类 Excel 全栈解决方案在处理大型 Excel 文档时的优化思路:
1、利用GcExcel在服务端批量处理 Excel 的特性和性能优势,在Java或 .NET平台对整个Excel文档进行加载和总体计算。
2、仅利用纯前端表格控件SpreadJS来展示页面结果,并实现与用户进行交互。
方案架构图如下所示:

根据这样的设计,GcExcel可以有效分担原本SpreadJS的部分任务(这部分任务本身会大量消耗前端性能),减轻前端压力,全栈结构也有效避免了头重脚轻,使应用程序更加优雅。
本期主要介绍了全栈表格技术在应对复杂公式计算场景时的设计思路,下一期我们将从代码开始详细讲解。如果您的项目中有类似的需求,或者希望进一步了解类 Excel 全栈解决方案的应用场景和案例,欢迎前往葡萄城官网。
SpreadJS + GcExcel 一出,谁与争锋!全栈表格技术轻松应对复杂公式计算场景(一)的更多相关文章
- 华为全栈AI技术干货深度解析,解锁企业AI开发“秘籍”
摘要:针对企业AI开发应用中面临的痛点和难点,为大家带来从实践出发帮助企业构建成熟高效的AI开发流程解决方案. 在数字化转型浪潮席卷全球的今天,AI技术已经成为行业公认的升级重点,正在越来越多的领域为 ...
- 思道OA PK 通达OA 同场竞技 谁与争锋
技术架构 思道OA 通达OA 开发语言 微软ASP.NET 4.0 PHP开源脚本语言 64位平台 64位 32位 数据库 SQL Server大数据库 MySQL开源数据库 官网下载 下载地址 下载 ...
- C/S与B/S谁与争锋之我见
看到网上有些人在讨论C/S架构和B/S架构以及它们的发展趋势,后起之秀B/S是否真将取代C/S而存在?在发表我的观点之前,我们先来一起来回顾下C/S以及B/S. 一C/S 1.C/S概念 C/S是Cl ...
- Vue.js与Jquery的比较 谁与争锋 js风暴
普遍认为jQuery是适合web初学者的起步工具.许多人甚至在学习jQuery之前,他们已经学习了一些轻量JavaScript知识.为什么?部分是因为jQuery的流行,但主要是源于经验开发人员的一个 ...
- R vs Python,数据分析中谁与争锋?
R和Python两者谁更适合数据分析领域?在某些特定情况下谁会更有优势?还是一个天生在各方面都比另一个更好? 当我们想要选择一种编程语言进行数据分析时,相信大多数人都会想到R和Python——但是从这 ...
- 新一批创业者金矿,iclap谁与争锋
19世纪,美国西部开发,无数拓荒者涌入,并最终因金矿的发现形成了淘金热.而当无数人埋头寻找黄金之时,有一个人却抬起头看到了潜藏在无数淘金者身上的金矿-这个人就是牛仔裤的发明者,Levi’s的创始人-李 ...
- 第1课 Git、谁与争锋
1-1 安装和使用Git http://git-scm.com/downloads Git的指令模式,才能够清楚地了解Git的工作细节.最后还会介绍Git Server的架设和管理,让读者能够熟练使 ...
- [cnBeta]阿里云推出全栈IPv6解决方案 加速推进下一代互联网应用
https://www.cnbeta.com/articles/tech/795695.htm 访问: 阿里云 - 最高1888元通用代金券立即可用 作为国内首个全面支持IPv6的云厂商,过去5个月, ...
- 基于LeanCloud云引擎的Web全栈方案
LeanEngine-Full-Stack The FULL STACK DEVELOPER 复杂的项目, 协作分工, 自动化流程,代码组织结构,框架选择,国际化方案等 Generator 或者See ...
随机推荐
- 在DigitalOcean vps中安装vnstat监控流量,浏览器打开php代码。。。
由于DigitalOcean中没有发现可以观察已用流量的功能,有想知道自己的流量使用情况,所以安装了vnstat. 安装过程十分简单,见百度经验,官方主页等. 1.安装完vnstat后,直接命令vns ...
- golang中int、float、string数据类型之间的转换
package main import ( "fmt" "strconv" ) func main() { var num1 int = 88 var num2 ...
- golang中往脚本传递参数的两种用法os.Args和flag
1. os.Args package main import ( "fmt" "os" ) func main() { // 执行:./demo.exe 127 ...
- VC++线程同步之临界区(CriticalSection)
1.相关文件和接口 #include <windows.h> CRITICAL_SECTION cs;//定义临界区对象 InitializeCriticalSection(&cs ...
- uni微信小程序优化,几行代码就能省100kb的主包空间?
不是标题党,我们公司的项目确确实实是省下了100kb的主包空间,而且还是在没有牺牲任何的性能和业务的前提下实现的. 但是100kb是根据项目大小,所以你用这个插件可能省下超过100kb或者更少. 直接 ...
- 对线面试官,凭借nginx能一战封神吗?
面试官:小伙子,你对nginx熟悉吗? 我:当然熟悉了,请听我慢慢道来. 心里想,我能吊打面试官吗?今天非得灭一灭面试官的威风,平时都被怼的狗血淋头. 面试官:就你那点花花肠子,咱还不清楚. 我:.. ...
- 布局TabBar
布局TabBar中的items Tabbar中应该有5个Item 主页/消息/发布按钮/发现/我 布局TabBar中的Items可以通过下面的方式 通过自定义TabBar的方式 多添加一个控制器,让中 ...
- jvm与dvm两种虚拟机的不同
jvm : java虚拟机 sun dvm: dalvik虚拟机 google 区别: 1.基于的架构不同,jvm 基于栈架构,栈是位于内存上的一个空间,执行指令操作,需要 ...
- Redis——(主从复制、哨兵模式、集群)的部署及搭建
Redis--(主从复制.哨兵模式.集群)的部署及搭建 重点: 主从复制:主从复制是高可用redis的基础,主从复制主要实现了数据的多机备份,以及对于读操作的负载均衡和简单的故障恢复. 哨兵和集群都是 ...
- Nginx中的 location 匹配和 rewrite 重写跳转
Nginx中的location匹配和rewrite重写跳转 1.常用的Nginx正则表达式 2.location 3.rewrite 4.rewrite实例 1.常用的Nginx正则表达式: ^ :匹 ...