diff options
| author |  Alex Jet <aleksandrjet@gmail.com>
| 2024-01-04 18:01:08 +0700 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2024-01-04 11:01:08 +0000 |
| commit | 0903ef90494e9c8bd0272347a0cdd51eca7f4648 (patch) | |
| tree | b079600983dac94242632eda9d0cbaf7f570e3ee /examples/framework-preact/src | |
| parent | a1b324b31b185857e1b2c265c9a077c511c5f7d3 (diff) | |
| download | astro-0903ef90494e9c8bd0272347a0cdd51eca7f4648.tar.gz astro-0903ef90494e9c8bd0272347a0cdd51eca7f4648.tar.zst astro-0903ef90494e9c8bd0272347a0cdd51eca7f4648.zip | |
feat: add preact-ssr-prepass (#9524)
* feat: add preact-ssr-prepass
* added more info to changelog
* fix example in changelog
* fix changelog description
* fix tab in code of changelog
* Update .changeset/blue-bobcats-remain.md
---------
Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>
Diffstat (limited to 'examples/framework-preact/src')
4 files changed, 15 insertions, 5 deletions
diff --git a/examples/framework-preact/src/components/Counter.css b/examples/framework-preact/src/components/Counter.css index fb21044d7..656b19d42 100644 --- a/examples/framework-preact/src/components/Counter.css +++ b/examples/framework-preact/src/components/Counter.css @@ -5,7 +5,3 @@ margin-top: 2em; place-items: center; } - -.counter-message { - text-align: center; -} diff --git a/examples/framework-preact/src/components/Counter.tsx b/examples/framework-preact/src/components/Counter.tsx index 5d702fb42..f7db88c6d 100644 --- a/examples/framework-preact/src/components/Counter.tsx +++ b/examples/framework-preact/src/components/Counter.tsx @@ -1,6 +1,10 @@ import { h, Fragment } from 'preact'; +import { lazy, Suspense } from 'preact/compat'; import './Counter.css'; +const Message = lazy(async () => import('./Message')); +const Fallback = () => <p>Loading...</p>; + export default function Counter({ children, count }) { const add = () => count.value++; const subtract = () => count.value--; @@ -12,7 +16,9 @@ export default function Counter({ children, count }) { <pre>{count}</pre> <button onClick={add}>+</button> </div> - <div class="counter-message">{children}</div> + <Suspense fallback={Fallback}> + <Message>{children}</Message> + </Suspense> </> ); } diff --git a/examples/framework-preact/src/components/Message.css b/examples/framework-preact/src/components/Message.css new file mode 100644 index 000000000..71ffc2c31 --- /dev/null +++ b/examples/framework-preact/src/components/Message.css @@ -0,0 +1,3 @@ +.message { + text-align: center; +} diff --git a/examples/framework-preact/src/components/Message.tsx b/examples/framework-preact/src/components/Message.tsx new file mode 100644 index 000000000..2ae48d04b --- /dev/null +++ b/examples/framework-preact/src/components/Message.tsx @@ -0,0 +1,5 @@ +import './Message.css'; + +export default function Message({ children }) { + return <div class="message">{children}</div>; +} |