@webqit/observer 2.1.8 → 2.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -8
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -14,20 +14,19 @@ Observer API is an upcoming proposal!
|
|
|
14
14
|
|
|
15
15
|
## Motivation
|
|
16
16
|
|
|
17
|
-
Tracking mutations on JavaScript objects has historically relied on "object wrapping" techniques with [ES6 Proxies](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), and on "property mangling" techniques with [getters and setters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty). Besides the *object identity* problem of the first and the *object compromissory* nature of the second, there is also the "scalability" issue inherent to the techniques and much "inflexibility" in the programming model they enable
|
|
17
|
+
Tracking mutations on JavaScript objects has historically relied on "object wrapping" techniques with [ES6 Proxies](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), and on "property mangling" techniques with [getters and setters](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty). Besides the *object identity* problem of the first and the *object compromissory* nature of the second, there is also the "scalability" issue inherent to the techniques and much "inflexibility" in the programming model they enable!
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
This is discussed extensively in [the introductory blog post](https://dev.to/oxharris/reinvestigating-reactivity-22e0-temp-slug-5973064?preview=8afd0f8b156bf0b0b1c08058837fe4986054e52a7450f0a28adbaf07dcb7f5659b724166f553fb98ceab3d080748e86b244684f515d579bcd0f48cbb#introducing-the-observer-api)<sup>draft</sup>
|
|
20
20
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
We find a design precedent to object observability in the [`Object.observe()`](https://web.dev/es7-observe/) API, which at one time checked all the boxes and touched the very pain points we have today! This is the idea with the new **Observer API**!
|
|
24
|
-
|
|
25
|
-
└ [See more in the introductory blog post](https://dev.to/oxharris/reinvestigating-reactivity-22e0-temp-slug-5973064?preview=8afd0f8b156bf0b0b1c08058837fe4986054e52a7450f0a28adbaf07dcb7f5659b724166f553fb98ceab3d080748e86b244684f515d579bcd0f48cbb#introducing-the-observer-api)<sup>draft</sup>
|
|
21
|
+
We find a design precedent to object observability in the [`Object.observe()`](https://web.dev/es7-observe/) API, which at one time checked all the boxes and touched the very pain points we have today! The idea with the new **Observer API** is to re-explore that unique design with a more wholistic approach that considers the broader subject of Reactive Programming in JavaScript!
|
|
26
22
|
|
|
27
23
|
## An Overview
|
|
28
24
|
|
|
29
25
|
The Observer API is a set of utility functions.
|
|
30
26
|
|
|
27
|
+
<details>
|
|
28
|
+
<summary><b>Show Outline</b></summary>
|
|
29
|
+
|
|
31
30
|
+ [Method: `Observer.observe()`](#method-observerobserve)
|
|
32
31
|
+ [Usage](#usage)
|
|
33
32
|
+ [Concept: *Mutation APIs*](#concept-mutation-apis)
|
|
@@ -39,6 +38,8 @@ The Observer API is a set of utility functions.
|
|
|
39
38
|
+ [Usage](#usage-1)
|
|
40
39
|
+ [API Reference](#api-reference)
|
|
41
40
|
|
|
41
|
+
</details>
|
|
42
|
+
|
|
42
43
|
> **Note**
|
|
43
44
|
> <br>This is documentation for `Observer@2.x`. (Looking for [`Observer@1.x`](https://github.com/webqit/observer/tree/v1.7.6)?)
|
|
44
45
|
|
|
@@ -310,7 +311,7 @@ Observer.observe( obj, path, m => {
|
|
|
310
311
|
} );
|
|
311
312
|
```
|
|
312
313
|
|
|
313
|
-
└ *Now, any operation that "
|
|
314
|
+
└ *Now, any operation that changes what "the value" at the path resolves to - either by tree extension or tree truncation - will fire our listener*:
|
|
314
315
|
|
|
315
316
|
```js
|
|
316
317
|
Observer.set( obj, 'level1', { level2: {}, } );
|
|
@@ -550,7 +551,9 @@ const Observer = window.webqit.Observer;
|
|
|
550
551
|
| `apply()` | ✓ | Invokes a function [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/apply) | `apply() {}` |
|
|
551
552
|
| `batch()` | `×` | Creates a batching context [↗](https://github.com/webqit/observer#:~:text=use%20the%20observer.batch()%20to%20batch%20multiple%20arbitrary%20mutations%20-%20whether%20related%20or%20not) | `-` |
|
|
552
553
|
| `construct()` | ✓ | Initializes a constructor [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/construct) | `construct() {}` |
|
|
554
|
+
| `defineProperties()` [↗]() | `×` | `defineProperty() {}` |
|
|
553
555
|
| `defineProperty()` | ✓ | Defines a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty) | `defineProperty() {}` |
|
|
556
|
+
| `deleteProperties()` [↗]() | `×` | `deleteProperty() {}` |
|
|
554
557
|
| `deleteProperty()` | ✓ | Deletes a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty) | `deleteProperty() {}` |
|
|
555
558
|
| `get()` | ✓ | Reads a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/get) | `get() {}` |
|
|
556
559
|
| `getOwnPropertyDescriptor()` | ✓ | Obtains property descriptor [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor) | `getOwnPropertyDescriptor() {}` |
|
|
@@ -575,7 +578,9 @@ const Observer = window.webqit.Observer;
|
|
|
575
578
|
| `apply()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/apply) | ✓ | `apply() {}` |
|
|
576
579
|
| `batch()` [↗](https://github.com/webqit/observer#concept-batch-mutations) | `×` | `-` |
|
|
577
580
|
| `construct()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/construct) | ✓ | `construct() {}` |
|
|
581
|
+
| `defineProperties()` [↗]() | `×` | `defineProperty() {}` |
|
|
578
582
|
| `defineProperty()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty) | ✓ | `defineProperty() {}` |
|
|
583
|
+
| `deleteProperties()` [↗]() | `×` | `deleteProperty() {}` |
|
|
579
584
|
| `deleteProperty()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty) | ✓ | `deleteProperty() {}` |
|
|
580
585
|
| `get()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/get) | ✓ | `get() {}` |
|
|
581
586
|
| `getOwnPropertyDescriptor()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor) | ✓ | `getOwnPropertyDescriptor() {}` |
|