jaandrle/deka-dom-el
1
0
Fork 0
mirror of https://github.com/jaandrle/deka-dom-el synced 2025-07-01 12:22:15 +02:00
Code Packages Releases Activity

🔤 3PS

Browse Source
This commit is contained in:
Jan Andrle
2024-06-03 16:20:42 +02:00
parent 57fb9512ee
commit 97f8c2eed3
7 changed files with 60 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/p04-signals.html
View File

@ -4,7 +4,7 @@ S===signal
/** @type {ddeSignal} */
/** @type {ddeAction} */
/** @type {ddeActions} */
</code></div><h3 id="h-introducing-signals"><!--<dde:mark type="component" name="h3" host="parentElement" ssr/>--><a href="#h-introducing-signals" tabindex="-1">#</a> Introducing signals</h3><p>Using signals, we split program logic into the&nbsp;three parts. Firstly (α), we create a&nbsp;variable (constant) representing reactive value. Somewhere later, we can register (β) a&nbsp;logic reacting to the&nbsp;signal value changes. Similarly, in a&nbsp;remaining part (γ), we can update the&nbsp;signal value. </p><!--<dde:mark type="component" name="example" host="this" ssr/>--><div id="code-example-1-1gy5flu0x85c" class="example"><!--<dde:mark type="component" name="code" host="parentElement" ssr/>--><code class="language-js">import { S } from "./esm-with-signals.js";
</code></div><h3 id="h-introducing-signals"><!--<dde:mark type="component" name="h3" host="parentElement" ssr/>--><a href="#h-introducing-signals" tabindex="-1">#</a> Introducing signals</h3><p>Let’s re-introduce <a href="./#h-event-driven-programming--parts-separation--ps">3PS principle</a>.</p><p>Using signals, we split program logic into the&nbsp;three parts. Firstly (α), we create a&nbsp;variable (constant) representing reactive value. Somewhere later, we can register (β) a&nbsp;logic reacting to the&nbsp;signal value changes. Similarly, in a&nbsp;remaining part (γ), we can update the&nbsp;signal value. </p><!--<dde:mark type="component" name="example" host="this" ssr/>--><div id="code-example-1-1gy5flu0x85c" class="example"><!--<dde:mark type="component" name="code" host="parentElement" ssr/>--><code class="language-js">import { S } from "./esm-with-signals.js";
// α — `signal` represents a&nbsp;reactive value
const signal= S(0);
// β — just reacts on signal changes