设计哲学

最小化

我们希望 Pattaya 能尽可能最小化,
Pattya 从设计的最初就坚持尽量不使用过多的外部依赖来保持他的轻量级,
不会偷偷为用户在 node_modules 里安装成百上千的依赖,
从而保持用户项目的干净,优化打包出更小的体积,构建更快速的应用。

最小化的另外一面是,我们期望减少开发者的心智负担,减少新概念的引入,
相反将开发者接口都架构于现有概念之上。
所有人都能理解线条,三角形,气泡,动画数值,点击事件等。
因此 Pattaya 的学习成本可能是其他同类库的 1/10。
这种想法让我们更多关注于实用性,可靠性和性能。而非创造新概念和炒作。

基于组合而非继承

Pattaya 基于原语,
Pattaya 的原语是指 三角形,线段,箭头之类的基本图形和其他常用 UI 图形,比如气泡。
我们发现大部分看起来非常复杂的图形,都可以使用简单的原语组合成,使用 Javascript 对象控制这些原语的色彩,大小等,可以让界面非常美观且实用,同时不会受限于某个图形库提供的特定功能。遇到问题也不会手足无措。

作为对比,Pattaya 通过组合不同的原语来构建出新图形,其他一些库通过输入几十个参数来控制图形行为,换言之,其他一些库让开发者继承了某些预制的图形。
在流行的可视化库 matplotlib 中,你可能需要 20+ 个参数来控制某个条形图的功能,这就像是继承了该条形图类。假如你需要在条形图上增加气泡提示,如果 matplotlib 没有提供,那么你只能通过一些 tricky 的方式处理。在 Pattaya 中,从始至终都是依靠组合,因此,增加一些线条或气泡都是非常自然的事情,你甚至不需要担心如何实现。
使用 Pattaya 另外一个额外的优点是,你不需要从几十上百个参数中学习如何改变图形的行为,或者学习库的特定 API。
实际上,这些类库和 Pattaya 位于不同的层级,你可以在 Pattaya 之上构建自己的可视化库或图形库。

如果你能简单的绘制文本,方块和箭头,你就能绘制条形图。
同时扩展该图也变得非常简单,
如果需求变更,你再也不用担心某个功能是否支持,你能控制这个图的一切。

面向原生的 Javascript

Pattaya 没有任何内置的状态处理的范式。
开发者可以随心所欲的使用原生的 Javascript 简单对象来控制图形。
底层的 Depict 不要求状态驱动,数据驱动或者事件驱动。选择你舒服的方式来实现自己的图形。
如果选择使用状态驱动,你会面对不同组件间如何通信的问题,所幸这种基于原语的设计并不需要通信!
如果你不喜欢 redux,mobx,flux, vuex 之类的状态库,那么这种原生 Javascript + render 的方式,将非常适合你。
作为对比,你不再需要思考页面是否重新渲染了,或者深比较浅比较,或者 React.useMemo 这样的钩子,也不再有纯组件,函数组件等一系列新的高级概念。如果你要求重新渲染,页面就会内部调度渲染。你不要求渲染,页面不变。
这种没有黑魔法和新概念的设计或许看起来不够高级,但能提供可控的高性能和简洁性。

美观

Pattaya 努力成为在默认配置下最美观的图形库。