docs: Structure pages guide, add by-name component access update.

website/docs/pages.md

@@ -4,6 +4,8 @@ title: Pages
 
 The Wave server stores and manages content. Content is stored in a page cache, called a *site*. A Wave server contains exactly one site. A site holds a collection of *pages*. A page is composed of *cards*. Cards hold content and [data buffers](buffers.md).
 
+## Reference
+
 To reference a site from within a Wave script, import `site`.
 
 ```py
@@ -37,6 +39,9 @@ async def serve(q: Q):
 ```py
 card = page['foo']
 ```
+
+## Add
+
 There are two ways to add a card to a page.
 
 The first way is to assign a new card to `page['foo']`.
@@ -62,11 +67,40 @@ card = page['foo']
 card = page.add('foo', ui.form_card(...)
 ```
 
+## Delete
+
 To delete a card named `foo` from a page, use `del page['foo']`:
+
 ```py
 del page['foo']
 ```
 
+To delete the page hosted at `/foo`, use `page.drop()` or `del site['/foo']`. The following three forms are equivalent.
+
+```py
+page = site['/foo']
+page.drop()
+```
+
+```py
+site['/foo'].drop()
+```
+
+```py
+del site['/foo']
+```
+
+Deleting a page automatically drops all cards associated with that page. Conversely, to delete all cards from a page, simply delete the page.
+
+To clear all cards in the active page from within a Wave app, use `q.page.drop()`:
+
+```py
+async def serve(q: Q):
+ await q.page.drop()
+```
+
+## Replace
+
 Assigning a card to `page['foo']` replaces any previously assigned card named `foo`. Therefore, the following two forms are equivalent. The second form is more concise, hence preferred.
 
 ```py
@@ -80,6 +114,19 @@ page['foo'] = card1
 page['foo'] = card2
 ```
 
+## Update
+
+To avoid recreating the card from scratch, but to only update a specific attribute, use `name` attribute to get the reference to the component:
+
+```py
+q.page['example'] = ui.form_card(box='1 1 4 4', items=[
+ ui.button(name='my_btn', label='Old label'),
+])
+q.page['example'].my_btn.label = 'New label'
+```
+
+## Save
+
 To save a page from within a Wave script, use `page.save()`.
 
 ```py
@@ -99,29 +146,7 @@ async def serve(q: Q):
 
 You don't need to explicitly create a new page. A page is automatically created on save if it doesn't exist.
 
-To delete the page hosted at `/foo`, use `page.drop()` or `del site['/foo']`. The following three forms are equivalent.
-
-```py
-page = site['/foo']
-page.drop()
-```
-
-```py
-site['/foo'].drop()
-```
-
-```py
-del site['/foo']
-```
-
-Deleting a page automatically drops all cards associated with that page. Conversely, to delete all cards from a page, simply delete the page.
-
-To clear all cards in the active page from within a Wave app, use `q.page.drop()`:
-
-```py
-async def serve(q: Q):
- await q.page.drop()
-```
+## Control non-app pages
 
 To update other (non-app) pages from within an app, use `AsyncSite`: