Skip to content

Commit 27c2265

Browse files
committed
Info update
1 parent 277dde8 commit 27c2265

File tree

2 files changed

+12
-6
lines changed

2 files changed

+12
-6
lines changed

docs/resources/ui/components/component-lifecycle.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,9 @@ Your component can also respond to certain keypress events. For more details on
7272
keyboard shortcuts](/resources/ui/pages/page-lifecycle#on-shortcut-press-action-trigger).
7373

7474
### On Dispose [Action Trigger]
75-
The **On Dispose** action trigger for components allows you to define actions that execute when the page containing the component is navigated away or removed from memory. This is particularly useful for performing cleanup tasks specific to the component, such as closing streams, canceling subscriptions, or releasing resources, ensuring efficient memory and resource management.
75+
The **On Dispose** action trigger for components allows you to define actions that execute when the page containing the component is navigated away or removed from memory. It is particularly useful for stopping ongoing operations.
76+
77+
Imagine a scenario where a [periodic action](../../../resources/control-flow/time-based-logic/periodic-action.md), such as fetching live weather updates, is started in a component when it is loaded (i.e, [On Initialization](#on-initialization-action-trigger)). The action runs periodically, providing real-time data updates as long as the component is active. However, when the page containg the component is navigated away, you need to stop the periodic action to conserve resources and prevent unnecessary processing. By using the On Dispose action trigger, you can safely stop the periodic updates and clean up any associated resources.
7678

7779
:::info
7880
The **On Dispose** action trigger is always executed before the [**parent page’s On Dispose**](../pages/page-lifecycle.md#on-dispose-action-trigger). This ensures that the component cleans up its resources first, allowing the parent to finalize its disposal without dependencies on the child.

docs/resources/ui/pages/page-lifecycle.md

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -152,13 +152,17 @@ To handle this, you can enable the option on the `TextField` widget to bypass ke
152152

153153
### On Dispose [Action Trigger]
154154

155-
The **On Dispose** action trigger allows you to define actions that execute when a page is navigated away from or removed from memory. It is particularly useful for performing cleanup tasks, such as closing long-lived connections, canceling subscriptions, or releasing resources, to prevent memory leaks and ensure efficient resource management.
155+
The **On Dispose** action trigger allows you to define actions that execute when a page is navigated away from or removed from memory. It is particularly useful for stopping ongoing operations.
156156

157-
:::tip[Possible Use Cases]
157+
Imagine a scenario where [audio recording](../../../ff-concepts/file-handling/audio/audio-recroding.md) is started when the page loads using the [On Page Load](#on-page-load-action-trigger) action trigger. The recording process runs as long as the user remains on the page. However, when the user navigates away, you need to stop the recording to save resources and ensure the recorded audio is finalized. By using the On Dispose action trigger, you can safely stop the recording and save the file.
158+
159+
Additionally, if you are using a third-party package that relies on persistent connections or listeners, you can leverage [Custom Actions](../../../ff-concepts/adding-customization/custom-actions.md) with the On Dispose action trigger to close streams or cancel subscriptions.
158160

159-
- **Cleaning Up Resources:** Use this action trigger to cancel timers, close database connections, or unsubscribe from streams to prevent memory leaks and unnecessary processing.
160-
- **Saving Data:** Save user inputs, application state, or progress to local storage or a database before the page is removed. This ensures that no critical information is lost during navigation or app lifecycle changes.
161-
- **Logging or Analytics:** Track user behavior or log events (e.g., page exit or time spent on a page) to monitor user engagement and improve the application experience.
161+
:::tip[Possible Use Cases]
162+
- **Cleaning Up Resources:** Use this action trigger to cancel timers, close database connections, or unsubscribe from streams to prevent memory leaks and unnecessary processing.
163+
- For example, real-time applications, such as stock trading platforms, rely on WebSocket connections to fetch live updates. A homepage displaying a live ticker of stock prices would require opening the WebSocket connection on page load and closing it on On Dispose. Without an On Dispose trigger, the WebSocket connection could remain open unnecessarily, leading to wasted resources and app instability.
164+
- **Finalizing Database Transactions**: Commit or roll back database transactions if the user leaves the page before completing the process.
165+
- **Logging or Analytics:** Track user behavior or log events (e.g., page exit or time spent on a page) to monitor user engagement and improve the application experience.
162166
:::
163167
![page-on-dispose.avif](imgs/page-on-dispose.avif)
164168

0 commit comments

Comments
 (0)