Explain how stream actions can be used within HTML

_source/handbook/05_streams.md

@@ -75,15 +75,15 @@ A Turbo Streams message is a fragment of HTML consisting of `<turbo-stream>` ele
 
 <turbo-stream action="morph" target="current_step">
   <template>
-    <!-- The contents of this template will replace the 
+    <!-- The contents of this template will replace the
     element with ID "current_step" via morph. -->
     <li>New item</li>
   </template>
 </turbo-stream>
 
 <turbo-stream action="morph" target="current_step" children-only>
   <template>
-    <!-- The contents of this template will replace the 
+    <!-- The contents of this template will replace the
     children of the element with ID "current_step" via morph. -->
     <li>New item</li>
   </template>
@@ -100,6 +100,8 @@ resolved by an [id](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_att
 
 You can render any number of stream elements in a single stream message from a WebSocket, SSE or in response to a form submission.
 
+Also, any stream element that's connected to the page dom will be interpreted, i.e. the stream action will execute and the element be removed from the dom. For example, this can be used to execute stream actions when a page or a frame is loaded.
+
 ## Actions With Multiple Targets
 
 Actions can be applied against multiple targets using the `targets` attribute with a CSS query selector, instead of the regular `target` attribute that uses a dom ID reference. Examples:

_source/reference/streams.md

@@ -146,3 +146,14 @@ To target multiple elements with a single action, use the `targets` attribute wi
 Turbo can connect to any form of stream to receive and process stream actions. A stream source must dispatch [MessageEvent](https://developer.mozilla.org/en-US/docs/Web/API/MessageEvent) messages that contain the stream action HTML in the `data` attribute of that event. It's then connected by `Turbo.session.connectStreamSource(source)` and disconnected via `Turbo.session.disconnectStreamSource(source)`. If you need to process stream actions from different source than something producing `MessageEvent`s, you can use `Turbo.renderStreamMessage(streamActionHTML)` to do so.
 
 A good way to wrap all this together is by using a custom element, like turbo-rails does with [TurboCableStreamSourceElement](https://github.com/hotwired/turbo-rails/blob/main/app/javascript/turbo/cable_stream_source_element.js).
+
+## Stream Elements inside HTML
+
+Turbo streams are implemented as [a custom HTML element](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements).
+The element is interpreted as part of the `connectedCallback` function that the browser calls when the element is
+connected to the page dom.
+
+This means that any stream elements that are rendered into the dom will be interpreted. After being interpreted, Turbo
+will remove the element from the dom. More specifically, it means that rendering stream actions inside the page or
+frame content HTML will cause them to be executed. This can be used to execute additional sideffects beside the main content
+loading.