salesforce / lwc

⚡️ LWC - A Blazing Fast, Enterprise-Grade Web Components Foundation
https://lwc.dev
Other
1.64k stars 393 forks source link

Optimize locally-scoped event listeners #4495

Open nolanlawson opened 2 months ago

nolanlawson commented 2 months ago

Currently we don't optimize event listeners that reference a local variable, for example in a for-loop:

<template for:each={list} for:item="task">
    <button key={task.id} onclick={task.delete}></button>
</template>

This produces:

on: {
    click: api_bind(task.delete),
},

Note that there is no caching on the $ctx object. Whereas there is if the referenced function is scoped to the top level (i.e. the component):

<button onclick={topScopedListener}></button>
on: {
  click: _m0 || ($ctx._m0 = api_bind($cmp.topScopedListener)),
},

Note that using this same system for locally-scoped variables is not possible, because it would lead to incorrect behavior – we don't want every task.delete in an array to be cached onto $ctx._m0, because this would mean that every event listener would just be the first task's delete.

It's possible, though, that we could do a similar caching optimization even for locally-scoped event listeners. This may be possible by using the task object itself as a WeakMap key, or by using the key as a key, or something.

caineblood commented 2 months ago

The above comment asking you to download a file is malware to steal your account; do not under any circumstances download or run it. The post needs to be removed. If you have attempted to run it please have your system cleaned and your account secured immediately.