-
Notifications
You must be signed in to change notification settings - Fork 344
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Master doc ged #1137
base: master
Are you sure you want to change the base?
Master doc ged #1137
Conversation
1a5da0c
to
daa58d4
Compare
daa58d4
to
a5c07d9
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a very useful and interesting document, I hope you will have time to complete and publish it soon, it is a pity that it had to be postponed for such a long time. Please inform me if I can help in any way.
## Reactivity | ||
|
||
With the reactivity system, each value created with the `useState` or the `reactive` | ||
function is a proxy that allows Owl to trask which keys/values have been read |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
function is a proxy that allows Owl to trask which keys/values have been read | |
function is a proxy that allows Owl to track which keys/values have been read |
that some => may miss | ||
rendering |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
that some => may miss | |
rendering | |
that some may miss rendering. | |
( Don't `let a=toRaw(r); f(a);` do `f(toRaw(r));` ) |
``` | ||
|
||
```js | ||
// bad => will cause extra rendering, possibly corrupt |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why this is bad?
}); | ||
``` | ||
|
||
other note: minimize async stuff |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks like an orphan in this context
A | ||
|
||
/ \ | ||
B C | ||
/ | \ | \ | ||
D E F G H |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A | |
/ \ | |
B C | |
/ | \ | \ | |
D E F G H | |
```mermaid | |
graph TD | |
A-->B | |
A-->C | |
B-->D | |
B-->E | |
B-->F | |
C-->G | |
C-->H | |
``` |
Notes: | ||
|
||
- model could be created elsewhere, in a service, in the start code, ... | ||
- one may want to mark some internal stuff as 'raw'... |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- one may want to mark some internal stuff as 'raw'... | |
- one may want to mark some internal stuff as 'raw', when reactivity is not necessary, to save the resources. |
|
||
- model could be created elsewhere, in a service, in the start code, ... | ||
- one may want to mark some internal stuff as 'raw'... | ||
- if created elsewhere, it should probably be done with `reactive` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- if created elsewhere, it should probably be done with `reactive` | |
- if created elsewhere, it should probably be done with `reactive` instead of `useState`, e.g. `obj.model = reactive(new MyModel)` |
- model could be created elsewhere, in a service, in the start code, ... | ||
- one may want to mark some internal stuff as 'raw'... | ||
- if created elsewhere, it should probably be done with `reactive` | ||
- the call to `reactive` could be done in the model constructor directly: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- the call to `reactive` could be done in the model constructor directly: | |
- the call to `reactive` could be done in the model constructor directly, so there would be no need to call `reactive` on each use: |
class MyModel { | ||
constructor() { | ||
... | ||
return reactive(this); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
return reactive(this); | |
return reactive(this); // All instances of MyModel will be recative automatically |
- one could slightly simplify the model use with a hook: | ||
|
||
```js | ||
function useModel() { | ||
const env = useEnv(); | ||
const model = env.model; | ||
return useState(model); | ||
} | ||
``` | ||
|
||
This can be simply used like this in a child component: | ||
|
||
```js | ||
setup() { | ||
this.model = useModel(); | ||
} | ||
``` |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is almost a duplicate of line 222
No description provided.