Newer Version Available
Abortable Actions
A set of actions for a single transaction, such as a click callback, are queued together to be sent to the server. If a user starts another transaction, for example by clicking another navigation item, all abortable actions are removed from the queue. The aborted actions are not sent to the server and their state is set to ABORTED.
An abortable action is sent to the server and executed normally unless it hasn’t returned from the server when a subsequent abortable action is added to the queue.
If some actions have been sent but not yet returned from the server, they will complete, but only the callback logic associated with the ABORTED state (action.getState() === "ABORTED") will be executed. This enables components to optionally log a message or clean up if they had an aborted action.
Marking an Action as Abortable
Mark a server-side action as abortable by using the setAbortable() method on the Action object in JavaScript. For example:
setCallback() has a third parameter that registers the action state that will invoke the callback. If you don't specify the third argument for setCallback(), it defaults to registering the SUCCESS and ERROR states.To check for aborted actions in your callback and take appropriate action, such as logging the aborted action, call setCallback() with the ABORTED state set explicitly in the third argument. For example:
Rapid Clicking
Imagine a navigation menu where each action is a potentially slow request to the server. A user may click on several navigation items quickly so that none of the server responses return before the subsequent click. If all the actions are marked as abortable, none of the callbacks will be called except for the last click. This improves user experience by avoiding flickering due to sequential rendering of multiple server responses.
Progressive Loading
Sometimes, you might want to do a progressive loading of data where the first set of items is loaded, followed by subsequent data loads after the rendering of the first set is complete. You can do this by calling a second set of actions after a delay, and using the setParentAction() method in the Action object to associate each action in the second set with one of the actions in the first set. This ensures that the second set of actions will abort if the user navigates away.