My TW Performance

[Damon Pritchett]

Hey all,

There have many discussions in the past about how big a TW can get before there are any performance issues so I figured I'd post this as a point of reference for folks wondering about that. I will note that I am not experiencing any performance issues at this time. The only delay that I notice is in the backlinks widget of a footer that is part of probably half of my tiddlers. The very first time I open this widget (it's in a tab), there is a delay. After that, there is no delay.

My TW is almost entirely text with all images as external links so that helps a lot.

Here is a screenshot about the size of my TW:

My single file TW is approaching 10 MB in size. It resides in a folder in OneDrive so that I can access it from either my desktop or my laptop both of which are fairly high performance machines.

Hope this helps anyone that is curious about large TWs (of which I consider mine large, at least for file size).

Damon

[Eric Shulman]

On Wednesday, June 3, 2020 at 2:48:00 PM UTC-7, Damon Pritchett wrote:

...The only delay that I notice is in the backlinks widget of a footer that is part of probably half of my tiddlers. The very first time I open this widget (it's in a tab), there is a delay. After that, there is no delay.

As of TW5.1.22, the backlinks[] filter operator now has a core "indexer".  This means that the first time the filter is invoked, it caches an internal data structure with the results of the filter, which it then re-uses for all subsequent occurrences of the backlinks[] operator.  This indexing produces the significant performance improvement you have observed.

-e

[Damon Pritchett]

Thanks Eric,

I thought that was likely the case. I should note that I wasn't really complaining about it about since it's only the first time and the delay is fairly short. I just thought it was an interesting point of observation.

Damon

[Diego Mesa]

Eric,

On node, is it possible to have all of this calculated once at startup? And then just update as necessary?

[TonyM]

Damon,

Thanks for sharing to the community. I would add some quick points for future readers of this post

• Apart from load time taking longer as a wiki grows, installing a Splash screen helps
• I have even included a message "preparing the interactive environment" to intrigue them
• The greatest limitation on performance seems to me to be what you see on screen
• Hide or close unnecessary elements like the side bar to boost performance
• I am working on a tool to snapshot tiddlers as static html in the wiki for tiddlers that are complex and more often don't change often.

Regards

Tony

[Damon Pritchett]

Thanks Tony.

I will say that even as large as my wiki is, it loads fairly quickly. I currently have a single tiddler open on startup. It’s a very small amount text along with a couple of external images. Sort of a “title page” of sorts.

I’m going to investigate the splash screen to see if that’s even faster.

Damon

[TonyM]

Damon,

The splash screen is not faster, it just warns people not to abandon the page if the see nothing while it loads. They say it only takes a few seconds and many will abandon following a link.

Regards

Tony

[Eric Shulman]

On Wednesday, June 3, 2020 at 6:24:39 PM UTC-7, Damon Pritchett wrote:

I will say that even as large as my wiki is, it loads fairly quickly. I currently have a single tiddler open on startup. It’s a very small amount text along with a couple of external images. Sort of a “title page” of sorts.
I’m going to investigate the splash screen to see if that’s even faster.

https://tiddlywiki.com/#Creating%20a%20splash%20screen

As described above a TW splash screen "is displayed while the wiki loads."

also note this:

"is embedded as static HTML/CSS within the TiddlyWiki HTML file. This is done with the SystemTag: $:/tags/RawMarkupWikified/TopBody."

By definition, a TW splash screen will be displayed before the TWCore and tiddlers are initialized.  Thus, this will *always* be the fastest way to display some initial content.

-e

[Damon Pritchett]

Ah, ok. I misunderstood. Thanks for the clarification. It makes perfect sense.

[TonyM]

Eric,

What is the best work flow for people to use to design a splash screen?

The power of tiddlywiki should allow us to generate the html/css we place in the tiddler.

Regards

Tony

[Scott Kingery]

There are instructions on tiddlywiki.com for how to build a splash screen. https://tiddlywiki.com/#Creating%20a%20splash%20screen

Or you could be lazy like me and just drag $:/SplashScreen from there into your own wiki.

[TonyM]

Scott,

Yes, but follow the link to https://tiddlywiki.com/#%24%3A%2FSplashScreen and you see a template to generate one from any tiddler could be made.

Much sweeter.

tony

[PMario]

On Thursday, June 4, 2020 at 1:15:59 AM UTC+2, Diego Mesa wrote:

...

On node, is it possible to have all of this calculated once at startup? And then just update as necessary?

The wiki.js module contains: exports.getTiddlerBacklinks() ... which will create the internal structure, if it doesn't exist.

So it may be possible to create a startup module, that creates the structure. ... BUT ... This would slow down the initial startup of the wiki. 

If a user clicks a link, that opens a tiddler, they "tolerate" a moderate delay, because they know, the wiki has to do something.

We should try to make the initial startup faster and not slower.

just some thoughts

mario

[Diego Mesa]

Mario,

I often startup my wiki once (through a screen/tmux session) and dont ever restart it, until my computer restarts (rarely).

In this case, I would be willing to trade a longer startup, for no slowdown while I'm actually using the wiki!

I was just thinking this could be an option.

Diego

[Michael Wiktowy]

Or if you want to be sneaky and just have the *perception* of fast loading, you can use your source code inspector on your tiddlywiki with all your tiddlers closed, copy the contents of the div.tc-page-container-wrapper element and the inline style sheet to put in the style scoped section and replace all the examples in that $:/Splashscreen . It looks like tiddlywiki opens instantly while everything is loaded in the background ... much like the MS Windows desktop.

I just tried it on http://mwiktowy.tiddlyspot.com/ and it looks pretty convincing. It scales properly with the browser window unlike a screenshot. You can even leave open an intro tiddler to copy over or make a fake "spinner" tiddler.

/Mike

[TonyM]

Michael,

Love it, I imagine variations on this are possible as well. Such as a welcome message and more.

This is almost the work flow I was asking Eric for. I am sure we can automate this further.

I was considering saving a static image of the tiddltwiki after load, with all links to the full wiki but I have not found the terminology for the default "domain" in HTML see here, there are still good reasons to do this but your answer points to the solution.

Also I read Creating a splash screen again and this can be broken down and a work flow developed. Identifying what css is needed for a given splash screen harvested from and existing tiddler, is all that remains.

Regards

Tony

[PMario]

On Thursday, June 4, 2020 at 9:23:34 PM UTC+2, Michael Wiktowy wrote:

Or if you want to be sneaky and just have the *perception* of fast loading, you can use your source code inspector on your tiddlywiki with all your tiddlers closed, copy the contents of the div.tc-page-container-wrapper element and the inline style sheet to put in the style scoped section and replace all the examples in that $:/Splashscreen . It looks like tiddlywiki opens instantly while everything is loaded in the background ... much like the MS Windows desktop.

Nice trick! ... A second possibility would be to create a Splashscreen, that is so "interesting / funny", that users do a "shift-reload", ... just to see it again.

May be some "internal" wiki statistics, like number of tiddlers, number of tags, ... last modified and so on... This info needs to be created and saved, with the last save action. So it is available during the next load.

If users are engaged during startup, delay time isn't or is less of a problem anymore.

have fun!

mario

[Damon Pritchett]

Haven't tried a splash screen yet, but am loving the conversation.

One performance note that I forgot to mention: I have a couple of custom searches setup; one the name of the tiddler and one for the prefix of the tiddler name. Both search show a bit of a delay when entering text in them which I attribute mostly to the large number of tiddlers that I'm trying to search through. This delay is not observed or is at least significantly shorter when using the standard search box in the sidebar. As I was typing this, I realized that I haven''t compared the code I'm using to the one the standard search is using. This is something I will do. 

Does anyone have a suggestion for improving the performance of custom searches?

Damon

[TonyM]

Damon,

Not listing all from the beginning is a good idea. As the 3 character before search limit helps. If you allow the desired string to be entered before listing found items, eg a submit button this can also help.

You could have a search already limited to tiddler, or system tiddler or some other item, before you type a string then the list starts. This is an advantage of classifying tiddlers with tag or I prefer an object-type field, you can limit searches to tasks, or other object-types or to those without an object-type from the beginning.

Any search may make use of internal indexes if the filter is written correctly see https://tiddlywiki.com/#Performance on the indexes.

Regards

Tony

[Damon Pritchett]

Hey Tony,

I already have the search limited by tag, but probably half of my tiddlers have that tag.

I like the idea of the submit button, but am unsure as to how to implement that. I know I need to couple a button with an action widget, but the documentation at Tiddlywiki.com is confusing to me. Could you point me to an example?

Thanks,

Damon

[Eric Shulman]

On Saturday, June 6, 2020 at 9:56:08 AM UTC-7, Damon Pritchett wrote:

I like the idea of the submit button, but am unsure as to how to implement that. I know I need to couple a button with an action widget, but the documentation at Tiddlywiki.com is confusing to me. Could you point me to an example?

Try this:

<$edit-text tag="input" tiddler="$:/temp/mysearch/input" default="" placeholder="enter search text" />
<$button> search
   <$action-setfield $tiddler="$:/temp/mysearch" text={{$:/temp/mysearch/input}} />
</$button>
<$button> reset
   <$action-setfield $tiddler="$:/temp/mysearch/input" text="" />
   <$action-setfield $tiddler="$:/temp/mysearch" text="" />
</$button>
<$reveal state="$:/temp/mysearch" type="nomatch" text="">
   <$list filter="[prefix{$:/temp/mysearch}]"><li><$link/></li></$list>
</$reveal>

notes:

* the $edit-text saves its input to $:/temp/mysearch/input

* the search $button copies that input to $:/temp/mysearch

* the reset $button clears both temp tiddlers

* the $reveal is used to prevent the search from finding ALL tiddlers when the input is blank

* the $list does the search, using the value copied into $:/temp/mysearch

let me know how it goes...

enjoy,

-e

[Damon Pritchett]

Thanks very much Eric.

That's just the example that I needed. It worked quite well.

There are certain search terms that still yield lots of tiddlers and I probably need to add more to the search box to limit that or just know that it will be a slightly longer search. I'm sure that part of the performance hit is that the search results are being output to a dynamic table (from Shiraz plugin) and I have several fields that are being populated for each tiddler. 

Damon