Destructors for async Unpoly compilers

Usually, Unpoly compiler destructors Show archive.org snapshot are returned from the compiler function.
However, when using async compiler functions, you can not register destructors via return.

This will not work:

Copyup.compiler('my-example', async (element) => {
  await something
  
  return function onDestroy() {
    // ...
  }
})

Instead, use up.destructor Show archive.org snapshot :

Copyup.compiler('my-example', async (element) => {
  await something
  
  up.destructor(element, function onDestroy() {
    // ...
  })
})

However, note that your element might be removed from the DOM while your async function is waiting. Then, up.destructor would register the destructor function on the detached element, but Unpoly never calls that destructor and your application effectively leaks memory.
In almost all cases you can avoid that by simply checking if your element is still attached to the DOM Show archive.org snapshot when your await statement passes.

Copyup.compiler('my-example', async (element) => {
  await something
  if (!element.isConnected) return
  
  up.destructor(element, function onDestroy() {
    // ...
  })
})