This document discusses the architecture and strategy for plugins in Chiasm, a data visualization tool. It proposes moving from using Bower and RequireJS to a system using JSPM and SystemJS for managing plugins. Key points include having plugins stored in separate repositories, configuring Chiasm to use plugins, and automating the process of creating, using, testing and bundling plugins.

1. Chiasm
Curran Kelleher May 2015

3. Data Visualizations
Data Systems

4. Chiasm

5. Chiasmconfiguration visualizations

6. configuration
Chiasm Runtime
Components
Plugins
updates
updates
creates
creates
creates

7. configuration:
alias →
plugin: String
state:
property → value

8. Config Diff → Actions
● create(alias, plugin)
● set(alias, property, value)
● unset(alias, property)
● destroy(alias)

9. do: Array<Action>
undo: Array<Action>

10. History Graph Navigation

11. Real-time Synchronization
Server
Client Client Client
do:
Array<Action>

12. Chiasm
Reactivis
Model.js
Bar ChartScatter Plot Line Chart
Chiasm Bundle
D3
Layout
Links
CSVLoader
...
Plugins
Chorus
DummyVis

13. Chiasm
Reactivis
Model.js
Bar ChartScatter Plot Line Chart
Chiasm Bundle
D3
Layout
Links
CSVLoader
...
Plugins
Chorus
DummyVis
currently AMD modules
in “plugins” directory

14. Chiasm
Reactivis
Model.js
Bar ChartScatter Plot Line Chart
Chiasm Bundle
D3
Layout
Links
CSVLoader
...
Plugins
Chorus
DummyVis
should all be
separate repositories

15. Plugin Architecture
● use a plugin
● create a plugin
● test a plugin
● bundle an application

16. package managers
module loaders
& bundlers
testing frameworks
task automation
SystemJS
+ ES6
Module
Loader

17. package managers
module loaders
& bundlers
testing frameworks
task automation
SystemJS
+ ES6
Module
Loader
current strategy

18. Bower & RequireJS
create a plugin:
● create GitHub repo
● tag a release
● publish to Bower
use a plugin:
● add Bower dependency
● modify RequireJS config
● modify Chiasm config

19. package managers
module loaders
& bundlers
testing frameworks
task automation
SystemJS
+ ES6
Module
Loader
proposed strategy

20. JSPM & SystemJS
create a plugin:
● create GitHub repo
● tag a release
use a plugin:
● modify Chiasm config