Reducing the styleRefresh when many (edit-) Tiddlers are open

[BurningTreeC]

Hello,

In my TiddlyFlex experiments I found out, that I can reduce the styleRefresh from 40ms to 20ms by caching the EditTemplates in global procedures. I opened 65 tiddlers for editing in a TiddlyFlex setting with the standard EditTemplates and the same in a TiddlyFlex setting with modified EditTemplates. I enabled the "dynanode" functionality which blocks refreshing children of it while a resize "animation" is ongoing. Then I dragged the sidebar-resizer and observed the performance logs in the console. The styleRefresh goes from around 40ms to around 20ms.

Now I believe we should cache globally whatever we can. EditTemplates, ViewTemplates, segments, other templates like Button templates or ListItemTemplates.

What do you think?

[pmario]

@BurningTreeC ... Does the version you link to in your post implement the "optimized" changes.

In some experiments a long time ago, I found out the "sticky titles" are suboptimal for styleRefresh -- I do not use them, so I did not dig deeper. Can you check that?

[BurningTreeC]

Yes, the version I link uses the cached EditTemplates. I will check the sticky titles

[pmario]

If I do disable the TiddlyFlex plugin, the styleRefresh goes down from ~60ms to 6ms-10ms even if layout is "default"

As soon as TiddlyFlex is installed, it uses much more time in styleRefresh. Also mainRefresh goes down to about 23-39ms
With TiddlyFlex my mainRefresh is 47-66ms

[pmario]

I think it's the $:/plugins/BTC/TiddlyFlex/styles/z-indexes tiddler.

First of all, \define xx() cannot be cached, if text substitution is used. So I think backticks will not really improve things here.

If I do change your \defines in z-indexes to \procedures everything goes down significantly. styleRefresh to 7-8 ms and mainRefresh to 28-45ms

I'm not sure, if your styles still work in TiddlyFlex. So more experiments needed.

Edit: --No they don't work. So the procedures have to be rewritten to do v5.3.x substitute[] filters.

[pmario]

Why do you need all those z-indexes in the first place?

[BurningTreeC]

I've now rewritten it to use procedures. The sticky titles otherwise don't work correctly

[pmario]

There seems to be a problem in edit mode

[BurningTreeC]

Thank you for pointing this out, I fixed it with a \whitespace trim

[pmario]

The following code seems to work, but I do not understand the nth-child thing. .tc-tiddler-view-frame:nth-child(100n+1) -- What should that do?

\whitespace trim

\function f.a() [[.tc-tiddlyflex-story-river-$(tiddlyFlexColumn)$ .tc-tiddlyflex-story-river-inner > .tc-tiddler-view-frame:nth-child(100n+$(currentTiddler)$) > .tc-tiddler-frame]substitute[]]

\function f.b()  [[.tc-tiddlyflex-story-river-$(tiddlyFlexColumn)$ .tc-tiddlyflex-story-river-inner > .tc-tiddler-edit-frame:nth-child(100n+$(currentTiddler)$) > .tc-tiddler-frame]substitute[]]

\function f.x() [<storyListCount>add[501]subtract<currentTiddler>]

\procedure tiddlyflex-tiddler-z-indexes-inner()

<$list filter="[range<storyListCount>]">
<<f.a>>,
<<f.b>> {
z-index: <<f.x>>;
}
</$list>

\end

\procedure tiddlyflex-tiddler-z-indexes()
<$set name="storyListCount" value={{{ [subfilter<tdff.tiddlyflex-story-river-filter>] +[count[]] }}}>
	<<tiddlyflex-tiddler-z-indexes-inner>>
</$set>
\end

<$list filter="[subfilter<tdff.tiddlyflex-enlist-columns>]" variable="tiddlyFlexColumn">
	<$set name="tv-story-list" value={{{ [[$:/StoryList-]addsuffix<tiddlyFlexColumn>] }}}>
		<<tiddlyflex-tiddler-z-indexes>>
	</$set>
</$list>

This seems to work for me too but I may be missing something

\function f.a() [[.tc-tiddlyflex-story-river-$(tiddlyFlexColumn)$ .tc-tiddlyflex-story-river-inner .tc-tiddler-frame]substitute[]]
\function f.b()  [[.tc-tiddlyflex-story-river-$(tiddlyFlexColumn)$ .tc-tiddlyflex-story-river-inner .tc-tiddler-frame]substitute[]]

[pmario]

There is one more problem. Since TiddlyFlex is a plugin, all the $:/tags/Stylesheet definitions bleed into the default styles.

IMO it would be better, to make it a Theme instead of a plugin. Themes are deactivated (removed) if they are switched. -> Just a thought

[BurningTreeC]

Good thought 👍

[BurningTreeC]

Hi @pmario

I now made all \define macros in my stylesheets \procedure
It doesn't have any impact on the styleRefresh. Also disabling the sticky titles doesn't have any impact.
The biggest impact on the styleRefresh has caching the editTemplates globally

[pmario]

If the sticky title is disabled the styles should not be created at all, because they are not needed. As soon as the sticky CSS is not there it should be faster.