Lit-html: Optimizations

Created on 2 Aug 2017  路  3Comments  路  Source: Polymer/lit-html

Tracking issue for optimization ideas we want to try when we have time.

  • [ ] - Change template instantiation for first render: Instead of TemplateInstance.new(), _clone(), update(), where clone imports the template, then does a tree walk of the clone to index the parts, then update() sets values, causing a bunch of insertNodes, combine into one method and do a tree walk of the template creating static nodes and parts values in one pass. This assumes appendChild is faster than insertNode.
  • [x] - Dirty-checking for simple values. This should make updates way faster. PR #35
  • [x] - Change the Part.setValue() API to take a list of values and an index to start from. This eliminates a slice() call. PR #42
  • [x] - Eliminate the near-full tree walk on instance first-render (alternate to first optimization). Maybe use childNodes like Polymer? PR #50
  • [ ] - Optimize for NodeParts that are the only child. They don't need start and end marker nodes.
  • [x] - Micro-optimizations around ordering of if/else cascades, instanceof, etc.

Most helpful comment

You might find manually walking trees to be faster than TreeWalker for the specific case being used here.
I did some performance analysis here:
https://github.com/developit/strip-dom-whitespace/issues/1#issuecomment-267873172

All 3 comments

FYI @sorvell @cdata @kevinpschaaf @zhaoz

You might find manually walking trees to be faster than TreeWalker for the specific case being used here.
I did some performance analysis here:
https://github.com/developit/strip-dom-whitespace/issues/1#issuecomment-267873172

Closing this, but opened #147 to track optimizing NodeParts that are the only child

Was this page helpful?
0 / 5 - 0 ratings

Related issues

RyanAfrish7 picture RyanAfrish7  路  4Comments

AndyOGo picture AndyOGo  路  3Comments

kaaninel picture kaaninel  路  3Comments

MVSICA-FICTA picture MVSICA-FICTA  路  5Comments

Christian24 picture Christian24  路  4Comments