2016-03-30 12 views
1

角度using this guide as a referenceで仮想スクロールツリー指示を実装しようとしています。しかし、私がスクロールを開始すると、ウォッチャーのカウントが17k〜20k +ウォッチャー(ページがクラッシュする)に爆発し、スクロールが一貫して遅くなり、何も試したことが役に立たないようです。ng-repeat仮想スコリングでウォッチャーカウントが爆発

私の現在のコードでPlunker:HERE

(Firefoxで私のために表示されない上に、注意してください、しかし、Chromeで働いています)。スクロールが災害ではないように他に何ができるか考えているなら、私はアイディアを開いています。あまりにも長い道のりのためにこれに取り組んで...私は試してみました

他の方法はされて:

$compile(element.components())(scope.$new())

する)(onScrollで呼ばれていました。結果:リストはもはや表示されなくなりました/ひどく遅れました。ページがクラッシュするまで、「$ compileでnullのinsertBeforeメソッドを呼び出すことはできません。

<li ng-repeat="node in nodeList" vs-node="node"></li>

赤、私は、リストが更新された場合にその範囲及びそれに関連するすべてのウォッチャが破壊されることを期待して各要素に独自の単離された範囲を与えることを試みました。結果は上記ウォッチャーの問題との差はありませんでした。

function clearVisibleProvider(nodeList){ 
    for(var i=nodeList.length-1; i >= 0; i--){ 
    nodeList[i] = null; 
    } 
    return nodeList; 

    function clearNode(node){ 
    if(node.nodes){ 
     for(var j=node.nodes.length-1; j >= 0; j--){ 
     clearNode(node.nodes[j]); 
     } 
    } 
    nodeList[i] = null; 
    } 
} 

古いリスト要素を置き換える前にクリアしようとしました。再び、違いはありません。メインリストが更新される前に、updateDisplayList()内で呼び出されました。

答えて

0

代わりに、通常のリストビューを使用するように再設計して目標を達成しました。表示されたノードはリストに平坦化され、マニュアル索引付けは物事の追跡に使用され、ネスティングはありません。ネストされる要素には、ツリー内の深さのレベルに基づいて計算されたパディングがあります。

また、私はあまりにも多くのノードを同時に取得していたバグもありました。代わりに50、私は200-500を得るだろう。しかし、ウォッチカウントが解決しなかった修正は爆発的なので、元の問題の原因とは考えません。