@webqit/observer 2.1.7 → 2.1.9
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 +11 -11
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -14,15 +14,11 @@ 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
|
|
|
@@ -310,7 +306,7 @@ Observer.observe( obj, path, m => {
|
|
|
310
306
|
} );
|
|
311
307
|
```
|
|
312
308
|
|
|
313
|
-
└ *Now, any operation that "
|
|
309
|
+
└ *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
310
|
|
|
315
311
|
```js
|
|
316
312
|
Observer.set( obj, 'level1', { level2: {}, } );
|
|
@@ -455,7 +451,7 @@ Intercept operations on any object or array before they happen!
|
|
|
455
451
|
|
|
456
452
|
```js
|
|
457
453
|
// Signature 1
|
|
458
|
-
Observer.intercept( obj,
|
|
454
|
+
Observer.intercept( obj, type, handler[, options = {} ]);
|
|
459
455
|
```
|
|
460
456
|
|
|
461
457
|
```js
|
|
@@ -550,7 +546,9 @@ const Observer = window.webqit.Observer;
|
|
|
550
546
|
| `apply()` | ✓ | Invokes a function [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/apply) | `apply() {}` |
|
|
551
547
|
| `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
548
|
| `construct()` | ✓ | Initializes a constructor [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/construct) | `construct() {}` |
|
|
549
|
+
| `defineProperties()` [↗]() | `×` | `defineProperty() {}` |
|
|
553
550
|
| `defineProperty()` | ✓ | Defines a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty) | `defineProperty() {}` |
|
|
551
|
+
| `deleteProperties()` [↗]() | `×` | `deleteProperty() {}` |
|
|
554
552
|
| `deleteProperty()` | ✓ | Deletes a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty) | `deleteProperty() {}` |
|
|
555
553
|
| `get()` | ✓ | Reads a property [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/get) | `get() {}` |
|
|
556
554
|
| `getOwnPropertyDescriptor()` | ✓ | Obtains property descriptor [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor) | `getOwnPropertyDescriptor() {}` |
|
|
@@ -573,9 +571,11 @@ const Observer = window.webqit.Observer;
|
|
|
573
571
|
| Observer API | Reflect API | Trap |
|
|
574
572
|
| -------------- | ------------ | ----------- |
|
|
575
573
|
| `apply()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/apply) | ✓ | `apply() {}` |
|
|
576
|
-
| `batch()` [↗](https://github.com/webqit/observer
|
|
574
|
+
| `batch()` [↗](https://github.com/webqit/observer#concept-batch-mutations) | `×` | `-` |
|
|
577
575
|
| `construct()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/construct) | ✓ | `construct() {}` |
|
|
576
|
+
| `defineProperties()` [↗]() | `×` | `defineProperty() {}` |
|
|
578
577
|
| `defineProperty()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/defineProperty) | ✓ | `defineProperty() {}` |
|
|
578
|
+
| `deleteProperties()` [↗]() | `×` | `deleteProperty() {}` |
|
|
579
579
|
| `deleteProperty()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/deleteProperty) | ✓ | `deleteProperty() {}` |
|
|
580
580
|
| `get()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/get) | ✓ | `get() {}` |
|
|
581
581
|
| `getOwnPropertyDescriptor()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/getOwnPropertyDescriptor) | ✓ | `getOwnPropertyDescriptor() {}` |
|
|
@@ -585,7 +585,7 @@ const Observer = window.webqit.Observer;
|
|
|
585
585
|
| `isExtensible()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/isExtensible) | ✓ | `isExtensible() {}` |
|
|
586
586
|
| `observe()` [↗](https://github.com/webqit/observer#method-observerobserve) | `×` | `-` |
|
|
587
587
|
| `ownKeys()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/ownKeys) | ✓ | `ownKeys() {}` |
|
|
588
|
-
| `path()` [↗](#
|
|
588
|
+
| `path()` [↗](https://github.com/webqit/observer#concept-paths) | `×` | `-` |
|
|
589
589
|
| `preventExtensions()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/preventExtensions) | ✓ | `preventExtensions() {}` |
|
|
590
590
|
| `set()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/set) | ✓ | `set() {}` |
|
|
591
591
|
| `setPrototypeOf()` [↗](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/setPrototypeOf) | ✓ | `setPrototypeOf() {}` |
|