Comments (4)
those are two different template literals ... try again:
const {wire, bind} = hyperHTML;
const li = info => hyperHTML.wire(info)`<li></li>`;
const info = {some: 'data'};
const sameLI = li(info)
// what if we use same template later on?
console.assert(
sameLI === li(info),
'same reference means exactly the same node'
);
from hyperhtml.
Please help me get the difference between calling wire()
twice in code or twice via anonymous function. As I understand it you do not compare the content of literals, but the literal arrays (strict comparisons), am I right?
const {wire} = hyperHTML;
const info = {some: 'data'};
const notSameLI = hyperHTML.wire(info)`<li></li>`;
const sameLI = li();
function li() {
return hyperHTML.wire(info)`<li></li>`
}
// this works, because literal is created just once inside li() function body
console.assert(
sameLI === li(),
'sameLI: same reference means exactly the same node'
);
// this doesn't work, because we have two literal objects with the same content
console.assert(
sameLI === hyperHTML.wire(info)`<li></li>`,
'notSameLI: same reference means exactly the same node'
);
https://jsfiddle.net/t24qgs36/
from hyperhtml.
Please help me get the difference between calling
wire()
twice in code or twice via anonymous function.
The issue is not wire()
, but how template literals uniqueness works.
const templates = new Set;
const tag = template => { templates.add(template); };
const same = value => tag`a${value}c`;
// these two calls will use the same template literal
same(1);
same(2);
// indeed the set size is 1
console.log(templates.size);
templates.clear();
// these are two different templates literals
// even with the same value (as it's irrelevant)
tag`a${1}c`;
tag`a${1}c`;
// this will log 2
console.log(templates.size);
As I understand it you do not compare the content of literals, but the literal arrays (strict comparisons), am I right?
I compare nothing, I associate a template literal to a node. If the template literal is different, the node is different.
That's how every template literal based library works, and again, it's because of how template literals uniqueness is specified by ECMAScript standard.
from hyperhtml.
more info here, since the behavior changed over time, and hyperHTML was born before that change:
https://medium.com/@WebReflection/a-tiny-disastrous-ecmascript-change-fadc05c83e69
from hyperhtml.
Related Issues (20)
- Booleans render as strings. In conditional rendering this can be unexpected. HOT 3
- crash in domdiff HOT 6
- Form can not have element with id of 'remove' HOT 6
- offsetWidth and offseHeight return 0 HOT 2
- What am I doing wrong? HOT 2
- Numeric input with 'value' attribute in IE11 HOT 7
- Can we use hyperhtml without bundler or any other tooling HOT 4
- Boolean readonly attribute HOT 4
- "original.cloneNode is not a function" using hyperhtml with basichtml HOT 2
- Only last element renders when reusing HOT 6
- Why so many projects? HOT 4
- Inline styles renders empty HOT 5
- Commuunity? HOT 9
- Is re-executing the render function locally a good practice? HOT 4
- 2.34.x is a breaking change, should be 3.0.x HOT 23
- README, dedicated forum and collective HOT 6
- Reuse Nodes also removed from new place HOT 7
- Time to drop legacy support for IE? HOT 3
- replace istanbul HOT 2
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 hyperhtml.