Comments (5)
Here’s an OrgPad for tracing this: https://orgpad.com/s/n3W2BotZfA_?open=all
from reagent.
@shaunlebron
I'm struggling to remember the flow of control right now (I knew it well in 2015!) , but from memory, I feel this is a key line of code:
https://github.com/reagent-project/reagent/blob/master/src/reagent/ratom.cljs#L466
Note the =
check.
Given your investigation (it looks like you have your head wrapped around the code) does that make any sense?
from reagent.
I wrote the docs which you are questioning, so I'm feeling like I should be able to answer you definitively, BUT it is all a long time ago ... so all I can add for the moment is a further fact I can remember ... there was a time when identical?
was used but that lead to programmers being "surprised", so we switched to =
(which actually does an identical?
check internally anyway but moves on to deeper, recursive comparison on false
)
This breaking change is documented in the change log for v6.0.0. Note the line:
Reactions now only trigger updates of dependent components if their value change, as reported by
=
(previously,identical?
was used).
from reagent.
There is also =
check on Reaction _run
method: https://github.com/reagent-project/reagent/blob/master/src/reagent/ratom.cljs#L436 This is called either directly from handle-change
or through the queue.
But yes, looks like if the component is directly dereffing a Ratom, the component will be rendered even if reset/swap doesn't change the value.
Component dereffing a RAtom:
ratom reset/swap -> notify the render reaction -> queue-render
Component dereffing a Reaction depending on a RAtom:
ratom reset/swap -> notify reaction -> run -> IF result changed -> notify the render reaction -> queue-render
from reagent.
@mike-thompson-day8 Not a bad memory for seven years ago! I currently understand only how ratoms trigger a specific kind of reaction— the one created for a component’s render function. Looking at your reference, I think that =
is related to a lazily evaluated reaction (?), wherein a Deref notifies its watchers, but only if it has changed in value.
I don’t think the reaction created purely for a component’s render function is ever deref’d like that. The only path to its auto-run function (i.e. batch/queue-render) is in handle-change
, which I think only fires in response to:
- a dependent ratom being reset to a non-
identical?
value or, - a dependent reaction being reset to a non-
=
value
NEW EDIT FOR THE DOCS?
“The ‘changed?’ semantics that make a component re-render are:identical?
for ratoms, and=
for reactions.
I don’t know yet if this is accurate or desirable, but that’s how I currently understand it.
@Deraen Thank you, I think you summarized it well, except for the last “reaction reset” is supposed to be “ratom reset”?— since the atom triggers the first reaction, which triggers the render reaction.
from reagent.
Related Issues (20)
- React 18 does not live reload with Shadow-CLJS in non-trivial projects HOT 5
- Prop types
- `TypeError` when using function components with `r/create-class` with `dom.server/render-to-string`
- ReactDOM.render is no longer supported in React 18. Use createRoot instead. HOT 2
- shadow-cljs emits a warning when using with-let HOT 4
- Korean input broken on :input and :textarea HOT 1
- Update docs? HOT 1
- MUI ThemeProvider not working HOT 1
- @@ -62,6 +62,45 @@ class _Config { } } // eslint-disable-next-line valid-jsdoc /** * fetch problem title, level via solved.ac api * @see {@link https://solvedac.github.io/unofficial-documentation/#/operations/getProblemByIdArray} * @param {string[]} pids - list of problem id (up to 100) * @param { ({ problemId, titleKo, level }) => void } callback */ function fetchProblemsFromSolvedAc(pids, callback) { const query = encodeURIComponent(pids.join(',')); console.log(`https://solved.ac/api/v3/problem/lookup?problemIds=${query}`); fetch(`https://solved.ac/api/v3/problem/lookup?problemIds=${query}`) .then((res) => { console.log('fetchProblemsFromSolvedAc', res); return res; }) .then((res) => res.json()) .then(callback) .catch(() => callback(null)); }
- Readme says npm i or add deps to .edn but (in my case at least) needed both HOT 1
- Any interest in being able to replace `react/createElement` with a custom function? HOT 7
- The cursor disappears at the end of a controlled input on Chrome
- Reusable components following HTML semantics of Opional Attributes and Variadic Children HOT 3
- Controlled input loses cursor under ShadowRoot in React 18 HOT 3
- snake_case mentioned instead kebab-case in documentation of create-class function.
- Class name composition is harder than it needs to be
- Missing documentation: how to pass a CSS custom property? HOT 1
- Missing documentation: what's the syntax for creating a non standard HTML attribute? HOT 1
- Is there really no way to create an HTML attribute without a value? HOT 8
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from reagent.