You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Feb 15, 2025. It is now read-only.
@@ -1178,15 +1178,15 @@ However, since each Observer has an instance to the Agile Instance, `useAgile()`
1178
1178
#### `proxyBased`
1179
1179
1180
1180
If the `useAgile()` hook should wrap a [Proxy()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) around its return value/s.
1181
-
Through this Proxy, AgileTs is able to track accessed properties in the returned object/s
1182
-
and can construct a path to these.
1183
-
The paths allow AgileTs to rerender the Component more efficiently,
1181
+
Through this Proxy, AgileTs is able to track accessed properties of the returned object/s
1182
+
and can construct a path to these.
1183
+
The paths allow AgileTs to rerender the Component more efficiently
1184
1184
by only causing a rerender when an actual accessed property value mutates.
1185
1185
Normally, the Component is always rerendered on a State change,
1186
-
regardless of whether the property value is accessed in the Component.
1187
-
This is totally fine if the value is primitive, or the whole object is displayed.
1188
-
However, as soon as we display only a small part of the bound State value object,
1189
-
the proxy feature might improve the performance.
1186
+
regardless of whether the changed property value is accessed in the Component.
1187
+
This is totally fine if the value is primitive or the whole object is displayed.
1188
+
However, as soon as we display only a tiny part of the bound State value object,
Copy file name to clipboardExpand all lines: docs/main/Introduction.md
+16-16Lines changed: 16 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -71,7 +71,7 @@ The benefit of keeping logic separate to UI-Components is to make your code more
71
71
72
72
Learn the powerful tools of AgileTs in a short amount of time. An excellent place to start are
73
73
our [Quick Start](./Installation.md) Guides, or if you don't like to follow any tutorials,
74
-
you can jump straight into our [Example](../examples/Indroduction.md) Section.
74
+
you can jump straight into our [Example](../examples/Introduction.md) Section.
75
75
76
76
77
77
## ⏳ Quick Example
@@ -110,11 +110,11 @@ It's only one click away. Just select your preferred Framework below.
110
110
111
111
More examples can be found in the [Example](../examples/Indroduction.md) Section.
112
112
113
-
## 👨💻 When use AgileTs
113
+
## 👨💻 When using AgileTs
114
114
115
115
AgileTs is thought to handle the States of the business logic and logic in general that isn't explicitly bound to a Component.
116
116
This includes, for example, `server caching States` like the logged-in user. AgileTs wasn't built to handle UI States like `isModalOpen`.
117
-
Therefore, AgileTs should be used as a friend and helper to outsource all business logic from your UI-Components.
117
+
Therefore, AgileTs should be used as a friend and helper to outsource all business logic from UI-Components.
118
118
119
119
## 🟦 Typescript
120
120
@@ -126,8 +126,8 @@ We have a variety of resources available to help you learn AgileTs. An excellent
126
126
our [Quick Start](./Installation.md) Guides, where you learn the basics about how to use AgileTs in a specific
127
127
Framework. After knowing the ground concept of AgileTs, we recommend checking out the [Style Guides](./StyleGuide.md).
128
128
The Style Guides will help you to get some inspiration on structuring a scalable application using AgileTs. Now you
129
-
are ready to use AgileTs wherever you want. In case you need some more information about some functionalities of AgileTs,
130
-
use the search bar in the top right corner. In case you have any further questions, don't hesitate to join our [Community Discord](https://discord.gg/T9GzreAwPH).
129
+
are ready to use AgileTs wherever you want. If you need some more information about some functionalities of AgileTs,
130
+
use the search bar in the top right corner. And in case you have any further questions, don't hesitate to join our [Community Discord](https://discord.gg/T9GzreAwPH).
131
131
132
132
## 👮 Data Flow
133
133
@@ -137,9 +137,9 @@ use the search bar in the top right corner. In case you have any further questio
137
137
138
138
In State-Management, the Data-Flow more or less starts and ends in the UI-Component.
139
139
For example, if we click a Button, we trigger an action that resolves in a UI change.
140
-
By clicking a Theme Button, we start an action that changes the color theme of the current site.
140
+
So by clicking a Theme Button, we start an action that changes the color theme of the current site.
141
141
In order that this color change can visibly happen, the Component has to rerender.
142
-
For that, we need to subscribe/bind the State (`THEME_STATE`) to the UI-Component,
142
+
For this, we need to subscribe/bind the State (`THEME_STATE`) to the UI-Component,
143
143
with, for instance, the `useAgile()` hook.
144
144
Such subscription is essential to rerender the Component whenever the subscribed State mutates.
145
145
```ts
@@ -155,7 +155,7 @@ onClick={() => {
155
155
The action, triggered by the Theme Button,
156
156
then mutates the actual `THEME_STATE` and might do some side calculations.
157
157
We can also omit this step and edit the State directly in the UI-Component.
158
-
Everyone as he likes. However, I personally prefer separating UI-Component logic from global/business logic.
158
+
Everyone as he likes. However, I prefer separating UI-Component logic from global/business logic.
159
159
```ts
160
160
const toggleTheme = () => {
161
161
THEME_STATE.invert();
@@ -178,7 +178,7 @@ THEME_STATE.ingestValue(/* new value of THEME_STATE */);
178
178
#### `4`
179
179
180
180
The Observer then creates a Job and passes it to the Runtime.
181
-
The passed Job has a reference to the Observer to perform the actual action
181
+
The created Job has a reference to the Observer itself in order to perform the actual action
182
182
and rerender the correct UI-Components.
183
183
```ts
184
184
// ..
@@ -202,7 +202,7 @@ jobsToRerender.push(job);
202
202
203
203
#### `6`
204
204
205
-
A side effect of running a Job is the rerendering of subscribed Components.
205
+
A side effect of running a Job is the rerendering of subscribed Components.
206
206
Another could be the persisting into a permanent Storage or rebuilding the Group output.
207
207
```ts
208
208
// ..
@@ -246,8 +246,8 @@ other documentation sections. Often to learn some more about specific properties
246
246
## 🤓 Glossary
247
247
248
248
In these docs, we will refer to our classes with a capital first letter.
249
-
For example, when you see 'state' we are referring to the programming concept `state`,
250
-
but when you see 'State' we are referring to our [State](../packages/core/features/state/Introduction.md) class.
249
+
For example, when you see 'state', we refer to the programming concept `state`,
250
+
but when you see 'State', we are referring to our [State](../packages/core/features/state/Introduction.md) class.
251
251
252
252
### `Agile Sub Instance`
253
253
Instances that hold a reference to the [`Agile Instance`](../packages/core/features/agile-instance/Introduction.md)
@@ -281,7 +281,7 @@ In July, I came to the conclusion to contribute to PulseJs, in order to speed up
281
281
But before I could do anything, I had to figure out how PulseJs works internally.
282
282
After hours, I still haven't figured out how it works. This was due to the fact that I was a Typescript noob,
283
283
and the codebase was not contributor friendly (No comments, variables called x, a, b, ..).
284
-
In order to learn how PulseJs works and to get a deeper understanding of Typescript,
284
+
To learn how PulseJs works and to get a deeper understanding of Typescript,
285
285
I decided to rewrite PulseJs from scratch in a separate project, later AgileTs.
286
286
After a while, I got the hang and understood how PulseJs works under the hood.
287
287
@@ -290,8 +290,8 @@ My [first contribution](https://github.com/pulse-framework/pulse/commits?author=
290
290
where I refactored the `PulseHOC`. Unfortunately, PulseJs was moving further and further away from my idea of an ideal State Management Framework.
291
291
For instance, they introduced the `Pulse.Core`, which more or less forced me to define all States, Actions in a single object called `core`.
292
292
I wouldn't say I liked that change since I switched, among other reasons, to PulseJs in order not to define all my States in a single object.
293
-
Because of this relatively large design change, I would have to rebuild my entire State Management Logic of my applications.
294
-
Which I didn't want to do, because I liked the old concept more.
293
+
Because of this relatively significant design change, I would have to rebuild my entire State Management Logic of my applications.
294
+
Which I didn't want to do because I liked the old concept more.
295
295
296
296
Luckily I had the refactored PulseJs version lying around, which I created to learn how PulseJs works internally and released it as an own framework called
0 commit comments