Why js libraries?

[Mat]

[These are general and basic questions so I post here rather than in the dev group. It should be of common interest.]

Take for example BurningTreeC's extremely promising hammerwidgets that uses the hammer.js library...

How does it differ from, say, a regular TW-widget? Is a js library adapted for TW perhaps just another way to say "multiple TW widgets"?

What are the implications of including these types of js-libraries? 

- It obviously increases the TW footprint. Can I know how much? Must I manually compare how many kB it differs from empty TW?

- I must assume it drags down performance but, again, how much? "Is it worth installing?"

- Because it is a library, does this mean all the library features become available in TW? Or does that depend on if the TW-guy has specifically adapted all features of the library for TW?

Can any js library be adapted for TW? Would it make sense to search around for open source js libraries looking for things that would improve TW?

Is there a step-by-step formula to adapt a js library... or just anything js for that matter... to work in TW, or is it a process requiring a lot of skill and know-how?

Thank you!

<:-)

[BurningTreeC]

[These are general and basic questions so I post here rather than in the dev group. It should be of common interest.]

Take for example BurningTreeC's extremely promising hammerwidgets that uses the hammer.js library...

How does it differ from, say, a regular TW-widget? Is a js library adapted for TW perhaps just another way to say "multiple TW widgets"?

Hi Mat, I'll answer in my words :

A js library incorporates methods and functions for a certain goal/use-case ... often there's a lot of work already done by such a library and if you would program that yourself for tiddlywiki you would spend hours, days or weeks. So you use that library, check if it's stable, tested, or use another one.

The libraries offer "access points" for the programmers, to integrate the given methods/functions in their project.

In the hammerwidgets case, there are 5 widgets that use the library and add the tiddlywiki "in/out" communication - without that, there would be no effect

That means, it needs a translator between tiddlywiki and the library - and that's a widget or a js macro

What are the implications of including these types of js-libraries? 

- It obviously increases the TW footprint. Can I know how much? Must I manually compare how many kB it differs from empty TW?

- I must assume it drags down performance but, again, how much? "Is it worth installing?"

- Because it is a library, does this mean all the library features become available in TW? Or does that depend on if the TW-guy has specifically adapted all features of the library for TW?

The footprint depends mostly on the filesize of the js library. The widgets most of the time are not that long/contain much less words

There are several libraries used within tiddlywiki: the text-slicer plugin uses the sax library. the diff view uses the google-diff-match-patch library. in some cases it's simply convenient to use those and not to program it yourself - in the end it would be similar code but a massive amount of additional work - already done by the open source community

The hammer.js library for example adds 24kb to a wiki when installing

The refactored codemirror plugin (the editor only) adds around 240kb

The old codemirror plugin was over 600kb (all together) of size

The heaviest plugin in terms of size appears to be xlsx-utils ~800kb?

Can any js library be adapted for TW? Would it make sense to search around for open source js libraries looking for things that would improve TW?

As far as I know, it must be without jQuery and I think it should have certain javascript standards - maybe someone of the devs can answer here a bit more precisely 

Is there a step-by-step formula to adapt a js library... or just anything js for that matter... to work in TW, or is it a process requiring a lot of skill and know-how?

That's a good question - looking at all the widgets (the tiddlers themselves) one can see that there's a structure that all of them follow

1) getting the attributes from the widget string

2) doing something with those attributes using tiddlywiki functions/methods and/or library functions/methods if the functionality is not given by tiddlywiki standalone

3) putting the output somewhere, changing states or dispatching actions

Thank you!

<:-)

These are just my discoveries and they're in my spoken (no expert programmer) language ;)

BTC