wip: more progress on parity docs.

Placeholders in the rsx macro for future features.
This commit is contained in:
Jonathan Kelley committed 2021-05-28 12:56:21 -04:00
1 parent 4d5c528b07
commit c5089ba3c5
12 files changed
+147 -241

No files matched your search

+62 -30
View File
@@ -2,33 +2,65 @@
Sorted by priority
| Feature | Dioxus | React |
| ---------------------- | ------ | ----- |
| Conditional Rendering | ✅ | ✅ |
| Map, Iterator | ✅ | ✅ |
| Keyed Components | ✅ | ✅ |
| Web | ✅ | ✅ |
| Desktop (webview) | ✅ | ✅ |
| Context | ✅ | ✅ |
| Hook | ✅ | ✅ |
| SSR | ✅ | ✅ |
| Runs natively | ✅ | 👀 |
| Null components | 👀 | ✅ |
| Fragments | 👀 | ✅ |
| Component Children | 👀 | ✅ |
| NodeRef | 👀 | ✅ |
| Controlled Inputs | 👀 | ✅ |
| No-div components | 👀 | ✅ |
| CSS/Inline Styles | 👀 | ✅ |
| 1st class global state | 👀 | ✅ |
| -------------------- | ----- | ----- |
| 1st class router | 👀 | ✅ |
| Suspense | 👀 | 👀 |
| Animation | 👀 | ✅ |
| Mobile | 👀 | ✅ |
| Desktop (native) | 👀 | ✅ |
| 3D Renderer | 👀 | ✅ |
| -------------------- | ----- | ----- |
| Portal | 👀 | ✅ |
| Error boundary | 👀 | ✅ |
| Code-splitting | 👀 | ✅ |
| Feature | Dioxus | React | Notes |
| ---------------------- | ------ | ----- | ------------------------------------ |
| ----- Phase 1 ----- | ----- | ----- | ----- |
| Conditional Rendering | ✅ | ✅ | if/then to hide/show component |
| Map, Iterator | ✅ | ✅ | map/filter/reduce rsx! |
| Keyed Components | ✅ | ✅ | advanced diffing with keys |
| Web | ✅ | ✅ | renderer for web browser |
| Desktop (webview) | ✅ | ✅ | renderer for desktop |
| Context | ✅ | ✅ | share state through the tree |
| Hook | ✅ | ✅ | memory cells in components |
| SSR | ✅ | ✅ | render directly to string |
| Runs natively | ✅ | 👀 | runs as a sharable binary |
| Null components | 👀 | ✅ | allow returning None |
| Fragments | 👀 | ✅ | no requirement on main root |
| Component Children | 👀 | ✅ | ctx.children() as a list of nodes |
| NodeRef | 👀 | ✅ | gain direct access to nodes |
| Controlled Inputs | 👀 | ✅ | stateful wrappers around inputs |
| No-div components | 👀 | ✅ | components that render components |
| CSS/Inline Styles | 🛠 | ✅ | syntax for inline/conditional styles |
| 1st class global state | 🛠 | ✅ | redux/recoil/mobx on top of context |
| ----- Phase 2 ----- | ----- | ----- | ----- |
| 1st class router | 👀 | ✅ | Hook built on top of history |
| Assets | 👀 | ✅ | include css/svg/img url statically |
| Integrated classnames | 🛠 | 👀 | built-in `classnames` |
| Suspense | 👀 | 👀 | schedule future render from future |
| Transition | 👀 | 👀 | High-level control over suspense |
| Animation | 👀 | ✅ | Spring-style animations |
| Mobile | 👀 | ✅ | Render with cacao |
| Desktop (native) | 👀 | ✅ | Render with native desktop |
| 3D Renderer | 👀 | ✅ | react-three-fiber |
| ----- Phase 3 ----- | ----- | ----- | ----- |
| Portal | 👀 | ✅ | cast elements through tree |
| Error/Panic boundary | 👀 | ✅ | catch panics and display BSOD |
| Code-splitting | 👀 | ✅ | Make bundle smaller/lazy |
| LiveView | 👀 | 👀 | Example for SSR + WASM apps |
## Required services:
---
Gloo is covering a lot of these. We want to build hooks around these, and provide examples on how to use them.
https://github.com/rustwasm/gloo
If the gloo service doesn't exist, then we need to contribute to the project
| Service | Hook examples | Current Projects |
| ---------------------------- | ------------- | ---------------- |
| Fetch | 👀 | Reqwest/surf |
| Local storage (cache) | 👀 | Gloo |
| Persistent storage (IndexDB) | 👀 | 👀 |
| WebSocket | 👀 | Gloo |
| 3D Renderer / WebGL | 👀 | Gloo |
| Web Worker | 👀 | 👀 |
| Router | 👀 | 👀 |
| Notifications | 👀 | 👀 |
| WebRTC Client | 👀 | 👀 |
| Service Workers | 👀 | 👀 |
| Resize Observer | 👀 | 👀 |
| Canvas | 👀 | 👀 |
| Clipboard | 👀 | 👀 |
| Fullscreen | 👀 | 👀 |
| History API | 👀 | 👀 |