question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

leaky proxy nodes when morphing

See original GitHub issue

Not sure if we want this issue here or in nanomorph, but looks like proxy nodes are leaked when a component is morphed to a new location in the dom. For example, if these two views are morphed, a proxy node will be rendered rather than the component:

function viewA (state, emit) {
  return html`
    <body>
      <a href="/">beep</a>
      <a href="/boop">boop</a>
      <div>
        ${component.render()}
      </div>
    </body>
  `
}

function viewB (state, emit) {
  return html`
    <body>
      <a href="/">beep</a>
      <a href="/boop">boop</a>
      ${component.render()}
    </body>
  `
}

You can see this behavior here:

Also interesting to note if the component’s update function returns true, the component will leak the proxy node on first morph, while subsequent morphs will correctly return the component.

Issue Analytics

  • State:open
  • Created 6 years ago
  • Reactions:2
  • Comments:8 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
bcomnescommented, Jan 1, 2018
  1. Third idea is to store a reference to the realNode in the proxyNode when its created so that it can be retrieved or returned from isSameNode or off of another property of the proxy.

e.g. if (isProxy(proxyNode) && !proxyNode.isSameNode(el)) replace(el, proxyNode.realNode)

1reaction
bcomnescommented, Dec 31, 2017

I think we could add a fairly easy work around into nanomorph.

The problem occurs when you create a diffTree with proxyNodes, and during the morph, the realNode that the proxyNode points to is removed prior to the proxyNode getting morphed into the realDom. Child re-ordering can typically handle a lot of these situations, but if the proxyNode is pointing to a realNode that isn’t in the realTree or apart of its sibling set of the realTree, nanomorph leaks proxyNodes.

Two ideas:

  1. When nanomorph receives a diffTree, querySelectAll a standard proxy identifier prior to morphing and use that to store references to the realNodes that the proxyNode is pointing at. In the event nanomorph wants to replace a realTree node with a proxyNode, check if we have a reference to this realNode that was removed from the tree and use that instead. 👍

  2. Have nanocomponent proxy nodes detect if they are ever put into the page and nanomorph the proxy back into whatever its supposed to be by storing a direct node reference every time the this.element getter is used. Would likely require on-load in all cases 👎

I think 1 is a more robust solution, but it could be a departure from the isSameNode idea we’ve been trying to stick to.

This would still be very fast.

The only remaining issue with nanomorph after we fix the leaking nodes is that child reordering has some worse case scenarios, e.g. where the entire sibling set morph cascades the entire set, rather than simple insertions and removals, which a diff set algorithm would fix. See http://nanomap.netlify.com for some examples of this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Wordle Analysis: 'leaky'
Wordle Analysis: leaky. Worst case words remaining: 872. Expected words remaining: 397.798. Information provided: 4.78639. (1 words) : leaky
Read more >
Proxy for cluster nodes - BlackCat Reasearch Facility
Problem Failover Cluster validation genereates a warning in the Storage section under “Validate CSV Settings”. The error message states: Failure ...
Read more >
EP2575313A1 - Morphing firewall - Google Patents
A firewall system and corresponding firewall method are described for protecting a trusted network against unauthorized access from an untrusted network.
Read more >
Reply To: Error with the morphing wing simulation
... mesh-motion, mesh-nodes, mesh-problem, mesh-quality, mesh-refinement, Mesh-sensitivity ... proportional-damping, proximity, proximity-effect, proxy ...
Read more >
Ways to Check if Your Proxy Is Leaking Your IP Address
Nonetheless, the client can sometimes bypass the proxy IP address, resulting in a torrent IP leak. Check for torrent IP leaks using torrent ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found