[REF] asyncroot: create asyncroot component

This component replaces the t-asyncroot directive.

doc/component.md

@@ -1164,8 +1164,8 @@ Here are a few tips on how to work with asynchronous components:
 3. Lazy loading external libraries is a good use case for async rendering. This
    is mostly fine, because we can assume that it will only takes a fraction of a
    second, and only once (see [`owl.utils.loadJS`](utils.md#loadjs))
-4. For all the other cases, the `t-asyncroot` directive (to use alongside
-   `t-component`) is there to help you. When this directive is met, a new rendering
+4. For all the other cases, the [`AsyncRoot`](misc.md#asyncroot) component is there to help you. When
+   this component is met, a new rendering
    sub tree is created, such that the rendering of that component (and its
    children) is not tied to the rendering of the rest of the interface. It can
    be used on an asynchronous component, to prevent it from delaying the
@@ -1177,7 +1177,9 @@ Here are a few tips on how to work with asynchronous components:
    ```xml
    <div t-name="ParentComponent">
      <SyncChild />
-     <AsyncChild t-asyncroot="1"/>
+     <AsyncRoot>
+        <AsyncChild/>
+     </AsyncRoot>
    </div>
    ```
 

doc/misc.md

@@ -0,0 +1,23 @@
+# 🦉 Miscellaneous 🦉
+
+## `AsyncRoot`
+
+When this component is used, a new rendering sub tree is created, such that the
+rendering of that component (and its children) is not tied to the rendering of
+the rest of the interface. It can be used on an asynchronous component, to
+prevent it from delaying the rendering of the whole interface, or on a
+synchronous one, such that its rendering isn't delayed by other (asynchronous)
+components. Note that this directive has no effect on the first rendering, but
+only on subsequent ones (triggered by state or props changes).
+
+```xml
+<div t-name="ParentComponent">
+  <SyncChild />
+  <AsyncRoot>
+     <AsyncChild/>
+  </AsyncRoot>
+</div>
+```
+
+The `AsyncRoot` assumes that there is exactly one root node inside it. It can
+be a dom node or a component.

doc/readme.md

@@ -29,6 +29,8 @@ owl
         useStore
         useDispatch
         useGetters
+    misc
+        AsyncRoot
     router
         Link
         RouteComponent
@@ -53,6 +55,7 @@ Note that for convenience, the `useState` hook is also exported at the root of t
 - [Context](context.md)
 - [Event Bus](event_bus.md)
 - [Hooks](hooks.md)
+- [Misc](misc.md)
 - [Observer](observer.md)
 - [QWeb](qweb.md)
 - [Router](router.md)