为何前端框架VUE到前端组件SpreadJS都选择了TypeScript

近期VUE作者尤雨溪发文阐述了Vue 3的设计过程,其中专门用一段落说明了切换到TypeScript开发的原因,尤大也在不同场合多次提到了TypeScript的优势,并总结说“真香”。

简单来说,VUE 3使用TypeScript作为开发语言有以下几点:

  1. 类型系统对于VUE这种规模的项目是十分必要的。“类型检查极大地减少了在重构期间引入意外错误的机会,并有助于贡献者更自信的进行重要的更改”。
  2. TS和Visual Studio Code的深度集成,TS 团队确实是在用心做事的。
  3. 使用TS的用户越来越多,VUE 3需要加强支持,直接使用TS减轻了维护负担。

关于TypeScript的优点有太多文章了,这里只从SpreadJS项目实际讲讲SpreadJS为何选择了TS,以及TS为SpreadJS带来了什么。

其实早在TypeScript还在RC版本时,SpreadJS团队已经使用TS了。当时在Visual Studio使用TS的确是为了让.NET 程序员写JavaScript,同时由于历史原因SpreadJS的早期一部分代码是直接从Spread .NET 版本移植而来,很多.NET代码复制过来就能用,节省了很大的迁移工作量,也保证了迁移到前端的代码质量。但是由于早期TS编译出来的JavaScript代码过于冗余,导致SpreadJS发布包过于臃肿,同时从.NET迁移过来的代码并不符合前端JS的风格,在开发人员的反对声中,SpreadJS用纯JavaScript进行了重构。

切换到JS后架构团队仍然对TS持续关注,随着TS的升级优化,项目构建工具的优化,团队可以有效的控制TS编译成JS代码的大小,SpreadJS在V11 SP2重新拥抱TS。

SpreadJS再次选择TypeScript作为开发语言主要有以下几点:

  1. 类型系统

    “类型系统对于SpreadJS这种规模的项目是十分必要的”!和VUE的原因一样,重构在开发过程中时刻发生,在静态类型检测的支持下调整一个模块中接口或者属性名称变得十分安全快捷,同时有Visual Code的配合,属性或者变量更名只需要一个F2进行rename即可完成。

    SpreadJS是多团队模块化开发,一些基础模块多项目共用。静态类型的API对开发和最终用户都是友好的,每次为了纠结接口中options是否带“s”而去查询文档对开发人员是十分痛苦的,有了Interface,不需要开发文档开发也可以方便的使用基础模块。

  2. 面向对象

    SpreadJS的设计是面向对象的,我们常用的Picture是从FloatingObject继承,CellType中有核心的基类Base CellType。在前端项目工程化的过程中,OOP和设计模式的使用是必然的,TypeScript让这些都变得更加简单。举例来说,属性、方法的作用域对于组件开发是非常重要的,在JS中封装私有变量需要使用闭包,大量的闭包在代码中十分不友好,而在TS中直接使用private修饰符即可。

  3. 开发环境

    首先我实现想不出不用Visual Code的理由,再加上VSCode对TS的深度支持,以及Chrome支持TS的直接调试,一切都变得顺理成章。

看起来SpreadJS使用TypeScript的理由十分简单,当然也有其他原因,但正是这些简单的理由让SpreadJS的开发团队效率提升了40%,项目更易维护,模块功能更易拓展、测试。SpreadJS在开发过程中经历了JS和TS的相互切换,用实践证明了TS对项目带来的积极影响。

当然任何事情都有两面性,那么对于不用TypeScript的几个常见理由SpreadJS是如何解决的:

  1. 学习曲线过于陡峭。

    作为SpreadJS的开发,ES6需要学习吗,OOP需要学习吗,设计模式需要学习吗?都需要,那TS还难吗,学不会吗?

  2. 它破坏了 JS 的动态特性。

    SpreadJS项目需要静态的类型检查!

  3. 转换现有项目的工作量太大。

    的确如此,项目投入了一个迭代周期进行TS的重构,但是这样做是值得的。当时,TS已经严格遵循 ECMAScript 规范,同时本身项目面向对象的设计,在转换过程中无需大量的设计重构,更多的是类和接口的声明以及类型的转换,来消除掉编译器提示的错误。

  4. 使用的库都是用 JavaScript 编写的。

    过去可能是比较大的问题,但是随着社区生态的建立,流行的JS库都有@types的支持,Babel 7也支持了TS。比如SpreadJS使用到的jszip和pdfkit都有对应的d.ts。如果您想用的库还没TS的支持,那可能它很久没人用了。

总结来说,如果您在开发像VUE、SpreadJS一样的底层框架或者基础组件;使用三大框架开发SPA项目;项目由多团队分多模块共同开发,那么是时候拥抱TypeScript了。

你可能感兴趣的:(javascript,spreadjs,typescript,vue3)