dy / spect

Observable selectors in DOM
https://dy.github.io/spect
MIT License
74 stars 8 forks source link

h: lists; diff algo is underused. Possible syntax #262

Closed dy closed 1 year ago

dy commented 2 years ago

Spect provides one of the fastest and the smallest in the world diff engine, but its potential is undiscovered. There should be an elegant way to render lists.

Maybe map operator?

// before
h`<${el}>${
    todos.map(items =>
      items.map(item => h`<li>${ item.text }</li>`)
    )
  }</>`

1

h`<${el}>${
    todos >> h`<li>${ it.text }</li>`
}</>`

👎🏼 >> conflicts visually with tag 👎🏼 requires it to be defined

2

h`<${el}>${
    todos | it => h`<li>${ it.text }</li>`
}</>`

👎🏼 function does not cast to indicative value by default, although gives non-NaN results 👎🏼 function must be parenthised: this syntax generates SyntaxError

3

h`<${el}>${
    item => h`<li>${ item.text }</li>` << todo
}</>`

👎🏼 << operator makes that part of function

4

h`<${el}><li :for=${item in todo}>${item.text}</li></>`

👎🏼 what is item in todo?

5 - collection method

h`<${el}>${
    todos.each(item => h`<li>${ item.text }</li>`)
  }</>`
dy commented 1 year ago

Out of spect scope. Belongs to either templize or nowhere from now on.