Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Rework throttled refresh #8677

Open
wants to merge 10 commits into
base: master
Choose a base branch
from
Open

Rework throttled refresh #8677

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
0a7c57c
Update render.js
BurningTreeC Oct 14, 2024
3663757
Update windows.js
BurningTreeC Oct 14, 2024
6addb77
add docs
BurningTreeC Oct 14, 2024
8eddb45
do it correctly
BurningTreeC Oct 15, 2024
7f9b5ae
differenciate between mainThrottledRefresh and styleThrottledRefresh
BurningTreeC Oct 15, 2024
20c2eb3
pass options object to throttledRefreshFn
BurningTreeC Oct 15, 2024
b755f09
small invisible update
BurningTreeC Oct 15, 2024
64019cb
updates
BurningTreeC Oct 15, 2024
9da4964
make this work
BurningTreeC Oct 15, 2024
c4b805c
disable performance instrumentation
BurningTreeC Oct 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
109 changes: 71 additions & 38 deletions core/modules/startup/render.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,14 +50,77 @@ exports.startup = function() {
$tw.styleElement = document.createElement("style");
$tw.styleElement.innerHTML = $tw.styleWidgetNode.assignedStyles;
document.head.insertBefore($tw.styleElement,document.head.firstChild);
$tw.wiki.addEventListener("change",$tw.perf.report("styleRefresh",function(changes) {
if($tw.styleWidgetNode.refresh(changes,$tw.styleContainer,null)) {
// Prepare refresh mechanism
var mainDeferredChanges = Object.create(null),
styleDeferredChanges = Object.create(null),
mainTimerId,
styleTimerId,
throttledRefreshFn = function(changes,options) {
options = options || {};
// Check if only tiddlers that are throttled have changed
var onlyThrottledTiddlersHaveChanged = true;
var deferredChanges = options.mainCondition ? mainDeferredChanges : styleDeferredChanges;
for(var title in changes) {
var tiddler = $tw.wiki.getTiddler(title);
if(!$tw.wiki.isVolatileTiddler(title) && (!tiddler || !(tiddler.hasField("draft.of") || tiddler.hasField("throttle.refresh") ||
(options.mainCondition && tiddler.hasField("throttle.refresh.main")) || (options.styleCondition && tiddler.hasField("throttle.refresh.style"))))) {
onlyThrottledTiddlersHaveChanged = false;
}
}
// Defer the change if only drafts have changed
if(options.mainCondition) {
if(mainTimerId) {
clearTimeout(mainTimerId);
}
mainTimerId = null;
} else if(options.styleCondition) {
if(styleTimerId) {
clearTimeout(styleTimerId);
}
styleTimerId = null;
}
if(onlyThrottledTiddlersHaveChanged) {
var timeout = parseInt($tw.wiki.getTiddlerText(DRAFT_TIDDLER_TIMEOUT_TITLE,""),10);
if(isNaN(timeout)) {
timeout = THROTTLE_REFRESH_TIMEOUT;
}
if(options.mainCondition) {
mainTimerId = setTimeout(options.throttledRefresh,timeout);
} else if(options.styleCondition) {
styleTimerId = setTimeout(options.throttledRefresh,timeout);
}
$tw.utils.extend(deferredChanges,changes);
} else {
$tw.utils.extend(deferredChanges,changes);
options.callback();
}
};
function refresh() {
// Process the refresh
$tw.hooks.invokeHook("th-page-refreshing");
$tw.pageWidgetNode.refresh(mainDeferredChanges);
mainDeferredChanges = Object.create(null);
$tw.hooks.invokeHook("th-page-refreshed");
}
function styleRefresh() {
if($tw.styleWidgetNode.refresh(styleDeferredChanges,$tw.styleContainer,null)) {
var newStyles = $tw.styleContainer.textContent;
if(newStyles !== $tw.styleWidgetNode.assignedStyles) {
$tw.styleWidgetNode.assignedStyles = newStyles;
$tw.styleElement.innerHTML = $tw.styleWidgetNode.assignedStyles;
}
}
styleDeferredChanges = Object.create(null);
}
var mainThrottledRefresh = $tw.perf.report("throttledMainRefresh",refresh),
styleThrottledRefresh = $tw.perf.report("throttledStyleRefresh",styleRefresh);
$tw.wiki.addEventListener("change",$tw.perf.report("styleRefresh",function(changes) {
throttledRefreshFn(changes,{
throttledRefresh: styleThrottledRefresh,
callback: styleRefresh,
mainCondition: false,
styleCondition: true
});
}));
// Display the $:/core/ui/PageTemplate tiddler to kick off the display
$tw.perf.report("mainRender",function() {
Expand All @@ -75,44 +138,14 @@ exports.startup = function() {
removeItem.parentNode.removeChild(removeItem);
}
});
// Prepare refresh mechanism
var deferredChanges = Object.create(null),
timerId;
function refresh() {
// Process the refresh
$tw.hooks.invokeHook("th-page-refreshing");
$tw.pageWidgetNode.refresh(deferredChanges);
deferredChanges = Object.create(null);
$tw.hooks.invokeHook("th-page-refreshed");
}
var throttledRefresh = $tw.perf.report("throttledRefresh",refresh);

// Add the change event handler
$tw.wiki.addEventListener("change",$tw.perf.report("mainRefresh",function(changes) {
// Check if only tiddlers that are throttled have changed
var onlyThrottledTiddlersHaveChanged = true;
for(var title in changes) {
var tiddler = $tw.wiki.getTiddler(title);
if(!$tw.wiki.isVolatileTiddler(title) && (!tiddler || !(tiddler.hasField("draft.of") || tiddler.hasField("throttle.refresh")))) {
onlyThrottledTiddlersHaveChanged = false;
}
}
// Defer the change if only drafts have changed
if(timerId) {
clearTimeout(timerId);
}
timerId = null;
if(onlyThrottledTiddlersHaveChanged) {
var timeout = parseInt($tw.wiki.getTiddlerText(DRAFT_TIDDLER_TIMEOUT_TITLE,""),10);
if(isNaN(timeout)) {
timeout = THROTTLE_REFRESH_TIMEOUT;
}
timerId = setTimeout(throttledRefresh,timeout);
$tw.utils.extend(deferredChanges,changes);
} else {
$tw.utils.extend(deferredChanges,changes);
refresh();
}
throttledRefreshFn(changes,{
throttledRefresh: mainThrottledRefresh,
callback: refresh,
mainCondition: true,
styleCondition: false
});
}));
// Fix up the link between the root widget and the page container
$tw.rootWidget.domNodes = [$tw.pageContainer];
Expand Down
90 changes: 82 additions & 8 deletions core/modules/startup/windows.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@ exports.startup = function() {
// Handle open window message
$tw.rootWidget.addEventListener("tm-open-window",function(event) {
// Get the parameters
var refreshHandler,
var mainRefreshHandler,
styleRefreshHandler,
title = event.param || event.tiddlerTitle,
paramObject = event.paramObject || {},
windowTitle = paramObject.windowTitle || title,
Expand Down Expand Up @@ -61,7 +62,8 @@ exports.startup = function() {
srcDocument.title = windowTitle;
srcWindow.addEventListener("beforeunload",function(event) {
delete $tw.windows[windowID];
$tw.wiki.removeEventListener("change",refreshHandler);
$tw.wiki.removeEventListener("change",styleRefreshHandler);
$tw.wiki.removeEventListener("change",mainRefreshHandler);
},false);
// Set up the styles
var styleWidgetNode = $tw.wiki.makeTranscludeWidget("$:/core/ui/PageStylesheet",{
Expand All @@ -72,19 +74,91 @@ exports.startup = function() {
styleWidgetNode.render(styleContainer,null);
var styleElement = srcDocument.createElement("style");
styleElement.innerHTML = styleContainer.textContent;
styleWidgetNode.assignedStyles = styleContainer.textContent;
srcDocument.head.insertBefore(styleElement,srcDocument.head.firstChild);
// Render the text of the tiddler
var parser = $tw.wiki.parseTiddler(template),
widgetNode = $tw.wiki.makeWidget(parser,{document: srcDocument, parentWidget: $tw.rootWidget, variables: variables});
widgetNode.render(srcDocument.body,srcDocument.body.firstChild);
// Function to handle refreshes
refreshHandler = function(changes) {
if(styleWidgetNode.refresh(changes,styleContainer,null)) {
styleElement.innerHTML = styleContainer.textContent;
// Prepare refresh mechanism
var mainDeferredChanges = Object.create(null),
styleDeferredChanges = Object.create(null),
mainTimerId,
styleTimerId,
throttledRefreshFn = function(changes,options) {
options = options || {};
// Check if only tiddlers that are throttled have changed
var onlyThrottledTiddlersHaveChanged = true;
var deferredChanges = options.mainCondition ? mainDeferredChanges : styleDeferredChanges;
for(var title in changes) {
var tiddler = $tw.wiki.getTiddler(title);
if(!$tw.wiki.isVolatileTiddler(title) && (!tiddler || !(tiddler.hasField("draft.of") || tiddler.hasField("throttle.refresh") ||
(options.mainCondition && tiddler.hasField("throttle.refresh.main")) || (options.styleCondition && tiddler.hasField("throttle.refresh.style"))))) {
onlyThrottledTiddlersHaveChanged = false;
}
}
// Defer the change if only drafts have changed
if(options.mainCondition) {
if(mainTimerId) {
clearTimeout(mainTimerId);
}
mainTimerId = null;
} else if(options.styleCondition) {
if(styleTimerId) {
clearTimeout(styleTimerId);
}
styleTimerId = null;
}
if(onlyThrottledTiddlersHaveChanged) {
var timeout = parseInt($tw.wiki.getTiddlerText(DRAFT_TIDDLER_TIMEOUT_TITLE,""),10);
if(isNaN(timeout)) {
timeout = THROTTLE_REFRESH_TIMEOUT;
}
if(options.mainCondition) {
mainTimerId = setTimeout(options.throttledRefresh,timeout);
} else if(options.styleCondition) {
styleTimerId = setTimeout(options.throttledRefresh,timeout);
}
$tw.utils.extend(deferredChanges,changes);
} else {
$tw.utils.extend(deferredChanges,changes);
options.callback();
}
};
var styleRefresh = function() {
if(styleWidgetNode.refresh(styleDeferredChanges,styleContainer,null)) {
var newStyles = styleContainer.textContent;
if(newStyles !== styleWidgetNode.assignedStyles) {
styleWidgetNode.assignedStyles = newStyles;
styleElement.innerHTML = styleWidgetNode.assignedStyles;
}
}
widgetNode.refresh(changes);
styleDeferredChanges = Object.create(null);
};
$tw.wiki.addEventListener("change",refreshHandler);
var mainRefresh = function() {
widgetNode.refresh(mainDeferredChanges);
mainDeferredChanges = Object.create(null);
};
var mainThrottledRefresh = $tw.perf.report("throttledMainRefresh",mainRefresh),
styleThrottledRefresh = $tw.perf.report("throttledStyleRefresh",styleRefresh);
styleRefreshHandler = function(changes) {
throttledRefreshFn(changes,{
throttledRefresh: styleThrottledRefresh,
callback: styleRefresh,
mainCondition: false,
styleCondition: true
});
};
mainRefreshHandler = function(changes) {
throttledRefreshFn(changes,{
throttledRefresh: mainThrottledRefresh,
callback: mainRefresh,
mainCondition: true,
styleCondition: false
});
};
$tw.wiki.addEventListener("change",styleRefreshHandler);
$tw.wiki.addEventListener("change",mainRefreshHandler);
// Listen for keyboard shortcuts
$tw.utils.addEventListeners(srcDocument,[{
name: "keydown",
Expand Down
2 changes: 2 additions & 0 deletions editions/tw5.com/tiddlers/mechanisms/RefreshThrottling.tid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ The rules governing refresh throttling are:
** Has the field `draft.of`
** Has the field `throttle.refresh`
** Has a title prefixed with `$:/temp/volatile/`
** <<.from-version "5.3.6">> Has the field `throttle.refresh.main` - then throttling will only occur in the main refresh
** <<.from-version "5.3.6">> Has the field `throttle.refresh.style` - then throttling will only occur in the style refresh
* If the refresh cycle is to be throttled, a timer is set for the internal specified in [[$:/config/Drafts/TypingTimeout|Hidden Setting: Typing Refresh Delay]] (cancelling any previously set timer)
** When the timer fires, the refresh cycle is triggered, passing the aggregated titles of all the deferred refresh cycles

Loading